:root{color-scheme:light;--ink:#19231f;--muted:#758079;--line:#e4e9e4;--canvas:#f5f7f4;--panel:#fff;--green:#123a32;--green-2:#1e5b4c;--mint:#e8f2ed;--gold:#c8a95f;--red:#b6423a;--amber:#a9711c;--sidebar:254px;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--canvas);font-size:14px;line-height:1.5}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.55;cursor:not-allowed}a{color:inherit}.app-shell{min-height:100vh}.app-shell[hidden],.login-screen[hidden]{display:none}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:var(--green);color:#f5f7f2;display:flex;flex-direction:column;z-index:20;padding:22px 15px 17px}.brand{height:55px;display:flex;align-items:center;gap:12px;padding:0 8px 19px;border-bottom:1px solid rgba(255,255,255,.12)}.brand-mark{width:38px;height:38px;border-radius:12px;background:#214f42;color:#e8d49b;display:grid;place-items:center;font-family:Georgia,serif;font-size:23px;font-weight:700;border:1px solid rgba(222,199,139,.35);flex:none}.brand-mark.large{width:58px;height:58px;border-radius:17px;font-size:34px}.brand-copy{display:flex;flex-direction:column;line-height:1.2}.brand-copy strong{font-size:16px;letter-spacing:.09em}.brand-copy span{font-size:11px;color:#b8ccc4;margin-top:4px}.sidebar-label{font-size:9px;color:#8da99e;letter-spacing:.14em;font-weight:700;padding:26px 12px 9px}.navigation{display:flex;flex-direction:column;gap:4px;overflow:auto}.nav-link{position:relative;display:flex;align-items:center;gap:12px;text-decoration:none;padding:10px 12px;border-radius:8px;color:#c2d2ca;font-size:13px;transition:.16s ease}.nav-link:hover{background:rgba(255,255,255,.075);color:#fff}.nav-link.active{background:#244f43;color:#fff;font-weight:600}.nav-link.active:before{content:"";position:absolute;left:-15px;top:9px;bottom:9px;width:3px;border-radius:0 4px 4px 0;background:#d3ba78}.nav-icon{width:18px;text-align:center;font-size:16px;color:#a6c1b4}.nav-link.active .nav-icon{color:#e2cc8e}.sidebar-bottom{margin-top:auto}.sidebar-note{display:flex;align-items:center;gap:9px;margin:15px 6px 14px;padding:11px;background:rgba(255,255,255,.055);color:#d2dfd8;border-radius:7px;font-size:11px}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#6dc493;box-shadow:0 0 0 3px rgba(109,196,147,.14)}.sidebar-version{padding:12px 9px 0;border-top:1px solid rgba(255,255,255,.12);font-size:10px;color:#d7e0d9}.sidebar-version span{float:right;color:#9db5aa}.main-area{margin-left:var(--sidebar);min-height:100vh;display:flex;flex-direction:column}.topbar{height:66px;display:flex;align-items:center;justify-content:space-between;padding:0 34px;background:rgba(255,255,255,.92);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10;backdrop-filter:blur(12px)}.breadcrumb{display:flex;align-items:center;gap:11px;font-size:12px;color:#829088}.breadcrumb strong{font-size:13px;color:var(--ink);font-weight:600}.crumb-sep{color:#c3cbc5}.topbar-actions{display:flex;align-items:center;gap:18px}.connection-pill{display:flex;align-items:center;gap:8px;color:#69766f;font-size:11px}.profile-chip{display:flex;align-items:center;gap:9px;padding-left:17px;border-left:1px solid var(--line)}.avatar{height:33px;width:33px;display:grid;place-items:center;background:#e8f0eb;color:#315c4e;border-radius:50%;font-weight:700;font-size:12px}.profile-meta{display:flex;flex-direction:column;line-height:1.2}.profile-meta strong{font-size:11px;font-weight:600}.profile-meta span{font-size:10px;color:var(--muted);margin-top:4px}.icon-button{border:0;background:transparent;color:#738078;border-radius:7px;width:34px;height:34px;display:grid;place-items:center;font-size:17px}.icon-button:hover{background:#f0f3f0;color:var(--ink)}.menu-toggle,.sidebar-close{display:none}.page-content{flex:1;width:100%;max-width:1500px;margin:0 auto;padding:29px 34px 46px}.page-footer{display:flex;justify-content:space-between;gap:15px;padding:13px 34px;color:#9aa49e;font-size:10px}.page-footer #offline-indicator{color:#a86713}.page-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:23px}.page-heading h1{font-size:24px;letter-spacing:-.04em;margin:0;font-weight:650}.page-heading p{margin:6px 0 0;color:var(--muted);font-size:12px}.eyebrow{font-size:9px;letter-spacing:.14em;color:#759084;font-weight:700;margin:0 0 8px}.button{display:inline-flex;justify-content:center;align-items:center;gap:8px;border:1px solid transparent;padding:9px 13px;border-radius:7px;font-size:12px;font-weight:600;line-height:1.2;transition:.15s}.button.primary{background:var(--green);color:#fff;box-shadow:0 2px 4px rgba(18,58,50,.12)}.button.primary:hover{background:#1b5144}.button.secondary{background:#fff;border-color:#dce3dd;color:#33453c}.button.secondary:hover{background:#f7f9f7;border-color:#bdc9c0}.button.subtle{background:#f0f5f1;color:#315c4e}.button.danger{background:#fff3f1;color:var(--red);border-color:#f0d6d2}.button.small{padding:6px 9px;font-size:11px}.button.full{width:100%;padding:12px}.button-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin-bottom:23px}.stat-card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:17px 18px;min-height:111px;box-shadow:0 2px 5px rgba(16,40,29,.018)}.stat-top{display:flex;justify-content:space-between;align-items:center;color:#7b8981;font-size:11px}.stat-icon{width:30px;height:30px;border-radius:9px;background:#eff5f1;color:#527b68;display:grid;place-items:center;font-size:15px}.stat-number{font-size:27px;line-height:1.1;font-weight:650;letter-spacing:-.04em;margin-top:14px}.stat-hint{font-size:10px;color:#9aa49e;margin-top:4px}.panel{background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 2px 5px rgba(16,40,29,.018)}.panel-header{min-height:55px;display:flex;align-items:center;justify-content:space-between;padding:13px 18px;border-bottom:1px solid #edf0ed;gap:14px}.panel-title{font-size:13px;font-weight:650}.panel-subtitle{font-size:10px;color:var(--muted);margin-top:3px}.activity-list{padding:0 18px}.activity-item{display:flex;align-items:flex-start;gap:11px;padding:13px 0;border-bottom:1px solid #f0f2f0}.activity-item:last-child{border-bottom:0}.activity-marker{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#eff5f1;color:#47735e;font-size:11px;flex:none}.activity-copy{flex:1}.activity-copy strong{display:block;font-size:11px;font-weight:600}.activity-copy span{display:block;color:#8c9890;font-size:10px;margin-top:3px}.activity-time{font-size:10px;color:#a1aaa4;white-space:nowrap}.dashboard-lower{display:grid;grid-template-columns:1.35fr .85fr;gap:15px}.quick-links{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:15px}.quick-link{border:1px solid var(--line);border-radius:8px;padding:12px;text-align:left;background:#fff;color:var(--ink);display:flex;align-items:center;gap:10px}.quick-link:hover{border-color:#bfd0c4;background:#fbfdfb}.quick-link-icon{display:grid;place-items:center;background:#eff5f1;color:#527b68;height:29px;width:29px;border-radius:8px}.quick-link strong{font-size:11px;display:block}.quick-link small{font-size:9px;color:var(--muted)}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}.toolbar-left,.toolbar-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.search-box{position:relative}.search-box input{width:245px;padding-left:34px}.search-icon{position:absolute;left:12px;top:8px;color:#99a39c;font-size:14px}.field,input,select,textarea{border:1px solid #dfe5df;border-radius:6px;background:#fff;color:var(--ink);padding:8px 10px;outline:none;min-height:35px;font-size:11px}input:focus,select:focus,textarea:focus{border-color:#70a18a;box-shadow:0 0 0 3px rgba(91,152,119,.12)}input::placeholder,textarea::placeholder{color:#a6afa9}.filter-select{min-width:135px;color:#536159}.table-wrap{overflow:auto;border-radius:0 0 10px 10px}.data-table{width:100%;border-collapse:collapse;white-space:nowrap}.data-table th{padding:10px 15px;text-align:left;background:#fbfcfb;color:#8a968e;font-size:9px;letter-spacing:.045em;text-transform:uppercase;font-weight:700;border-bottom:1px solid #edf0ed}.data-table td{padding:12px 15px;border-bottom:1px solid #f0f2f0;font-size:11px;color:#394740;vertical-align:middle}.data-table tr:last-child td{border-bottom:0}.data-table tbody tr:hover{background:#fbfdfb}.table-main{display:flex;align-items:center;gap:9px}.table-avatar{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:#eef4ef;color:#52755e;font-size:10px;font-weight:700;flex:none}.table-main strong{display:block;font-size:11px;font-weight:600}.table-main small{display:block;color:#929e96;font-size:9px;margin-top:2px}.muted{color:#89958e}.empty-state{padding:45px 18px;text-align:center;color:#87938b}.empty-state .empty-icon{font-size:27px;color:#afbeb4;margin-bottom:8px}.empty-state strong{display:block;color:#4c5b52;font-size:13px}.empty-state p{font-size:11px;margin:5px 0 14px}.badge{display:inline-flex;align-items:center;gap:5px;border-radius:20px;padding:4px 8px;font-size:9px;font-weight:600;background:#eef3ef;color:#597163}.badge:before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}.badge.active,.badge.success{color:#347a52;background:#e9f5ed}.badge.graduated{color:#536b99;background:#eef1f8}.badge.withdrawn,.badge.deceased{color:#8d9690;background:#f0f2f0}.badge.suspended{color:#a16b1a;background:#fff5e4}.badge.female{color:#86587e;background:#f7edf5}.badge.male{color:#4d6c90;background:#edf3f8}.row-actions{display:flex;gap:5px}.row-action{background:none;border:0;padding:5px;color:#75837a;font-size:11px;border-radius:5px}.row-action:hover{background:#edf3ee;color:#315c4e}.table-foot{display:flex;justify-content:space-between;padding:10px 14px;color:#97a19b;font-size:10px;border-top:1px solid #eef1ee}.module-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-card{padding:17px}.form-card h3{font-size:13px;margin:0 0 4px}.form-card>p{font-size:10px;color:var(--muted);margin:0 0 14px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.form-field{display:flex;flex-direction:column;gap:5px;min-width:0}.form-field.full-span{grid-column:1/-1}.form-field label,.modal-form label{font-size:10px;font-weight:600;color:#4d5a52}.form-field input,.form-field select,.form-field textarea{width:100%}.form-field textarea{min-height:74px;resize:vertical}.field-help{font-size:9px;color:#929e96}.section-title{font-size:11px;color:#69796f;font-weight:700;letter-spacing:.04em;margin:17px 0 9px;padding-top:12px;border-top:1px solid #edf0ed}.room-tree{padding:8px 17px}.tree-row{display:flex;align-items:center;gap:9px;padding:9px 0;border-bottom:1px solid #f0f2f0;font-size:11px}.tree-row:last-child{border-bottom:0}.tree-indent{width:calc(var(--level,0)*18px);flex:none}.tree-icon{color:#668a75}.tree-main{flex:1}.tree-main strong{font-weight:600}.tree-main small{display:block;color:#95a099;font-size:9px}.tree-capacity{font-size:10px;color:#748178;min-width:85px;text-align:right}.education-columns{display:grid;grid-template-columns:1fr 1.2fr;gap:15px}.compact-list{padding:5px 17px}.compact-row{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid #f0f2f0}.compact-row:last-child{border-bottom:0}.compact-initial{width:30px;height:30px;border-radius:8px;background:#edf3ef;color:#4d725c;display:grid;place-items:center;font-size:10px;font-weight:700}.compact-row-copy{flex:1}.compact-row-copy strong{display:block;font-size:11px;font-weight:600}.compact-row-copy small{font-size:9px;color:#929e96}.role-layout{display:grid;grid-template-columns:280px 1fr;gap:15px}.role-list{padding:7px}.role-option{width:100%;text-align:left;background:transparent;border:0;border-radius:7px;padding:10px;display:flex;flex-direction:column;gap:3px;color:#33433a}.role-option:hover,.role-option.selected{background:#eef4f0}.role-option strong{font-size:11px}.role-option small{font-size:9px;color:#88948d}.permission-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;padding:15px 18px}.permission-item{display:flex;align-items:flex-start;gap:8px;padding:8px 0;font-size:10px;color:#405046}.permission-item input{min-height:initial;margin:2px 0;accent-color:var(--green)}.permission-module{grid-column:1/-1;font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#8a968e;font-weight:700;margin-top:8px}.report-summary{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.summary-pill{border:1px solid var(--line);border-radius:7px;background:#fff;padding:9px 12px;color:#65736b;font-size:10px}.summary-pill strong{color:#304338;font-size:13px;margin-right:4px}.modal{border:0;border-radius:12px;padding:0;width:min(700px,calc(100vw - 28px));max-height:min(88vh,850px);box-shadow:0 24px 80px rgba(22,42,32,.24);overflow:auto}.modal::backdrop{background:rgba(15,28,22,.43);backdrop-filter:blur(2px)}.modal-head{display:flex;justify-content:space-between;align-items:flex-start;padding:17px 20px 13px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#fff;z-index:3}.modal-head h2{font-size:16px;margin:0}.modal-head p{font-size:10px;color:var(--muted);margin:4px 0 0}.modal-body{padding:17px 20px}.modal-footer{display:flex;justify-content:space-between;gap:10px;padding:12px 20px;border-top:1px solid var(--line);background:#fff;position:sticky;bottom:0;z-index:3}.modal-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.modal-form .form-field{gap:5px}.modal-form input,.modal-form select,.modal-form textarea{width:100%}.wizard-steps{display:flex;align-items:center;gap:7px;margin-bottom:17px}.wizard-step{display:flex;align-items:center;gap:6px;color:#9aa49d;font-size:9px}.wizard-step span{height:20px;width:20px;border-radius:50%;display:grid;place-items:center;background:#eef2ef;font-weight:700}.wizard-step.current{color:#315d4d;font-weight:700}.wizard-step.current span,.wizard-step.done span{background:#dcebe1;color:#315d4d}.wizard-line{height:1px;flex:1;background:#e5eae5}.wizard-pane[hidden]{display:none}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.detail-item{padding:9px 10px;border:1px solid #edf0ed;border-radius:7px}.detail-item small{display:block;color:#96a099;font-size:9px}.detail-item strong{display:block;color:#3b4b41;font-size:11px;margin-top:3px;font-weight:600;word-break:break-word}.detail-section{margin:16px 0 7px;font-size:11px;font-weight:700;color:#506256}.document-row,.history-row{display:flex;justify-content:space-between;gap:8px;padding:9px 0;border-bottom:1px solid #eff2ef;font-size:10px}.toast-region{position:fixed;right:20px;bottom:20px;z-index:80;display:flex;flex-direction:column;gap:8px}.toast{background:#173c32;color:white;padding:11px 14px;border-radius:8px;box-shadow:0 8px 26px rgba(18,58,50,.2);font-size:11px;max-width:350px;animation:toast-in .18s ease}.toast.error{background:#9a3832}.toast.info{background:#455d50}@keyframes toast-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}.form-error{color:#a23832;background:#fff2f0;padding:9px;border-radius:6px;font-size:10px}.login-screen{min-height:100vh;display:grid;grid-template-columns:minmax(380px,1.02fr) minmax(420px,.98fr);background:#fff}.login-visual{background:linear-gradient(145deg,#0e322b,#19483b 68%,#234f40);color:white;padding:10vh 10% 35px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center}.login-visual:after{content:"";position:absolute;width:420px;height:420px;border:0;border-radius:0;right:-145px;top:13%;box-shadow:none;background-image:var(--moon-stars);background-repeat:no-repeat;background-position:center;background-size:contain;opacity:.12}.login-visual .eyebrow{color:#c7b57f;margin-top:32px}.login-visual h1{font-family:Georgia,serif;font-size:49px;line-height:1.08;letter-spacing:-.03em;font-weight:500;margin:5px 0 15px}.login-description{color:#bed0c6;max-width:340px;font-size:13px}.login-foot{position:absolute;bottom:30px;font-size:9px;color:#9fb7aa}.login-panel{padding:60px max(40px,13%) 28px;display:flex;flex-direction:column;justify-content:center}.login-form{max-width:360px;width:100%;margin:auto}.login-form h2{font-size:27px;letter-spacing:-.04em;margin:0}.login-form>p{font-size:12px;color:var(--muted);margin:7px 0 24px}.login-form label{display:flex;flex-direction:column;gap:6px;font-size:10px;font-weight:600;margin-bottom:14px}.login-form input{padding:11px 12px;min-height:42px}.login-form .button{margin-top:5px}.login-secure{font-size:9px;color:#87948b;text-align:center;margin-top:15px}.login-secure span{color:#5c9b6e;font-size:8px;margin-right:5px}.login-copyright{text-align:center;color:#abb3ad;font-size:9px}.mobile-brand{display:none}.offline-page{min-height:100vh;display:grid;place-items:center;padding:20px;background:#f3f6f3}.offline-card{max-width:400px;background:white;padding:30px;border:1px solid var(--line);border-radius:12px;text-align:center;box-shadow:0 12px 40px rgba(16,40,29,.08)}.offline-card .brand-mark{margin:0 auto 22px}.offline-card h1{font-size:23px;margin:0}.offline-card p:not(.eyebrow){font-size:12px;color:var(--muted);margin:9px 0 20px}.skeleton{height:14px;background:linear-gradient(90deg,#f0f3f0,#f8faf8,#f0f3f0);background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:4px}@keyframes shimmer{to{background-position:-200% 0}}.offline-overlay{position:fixed;inset:auto 15px 15px 15px;background:#fff5e4;color:#805410;padding:10px 14px;border-radius:8px;z-index:60;font-size:11px;box-shadow:0 4px 18px rgba(54,43,16,.12)}
@media(max-width:1120px){:root{--sidebar:225px}.page-content{padding-left:24px;padding-right:24px}.topbar{padding:0 24px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dashboard-lower{grid-template-columns:1fr 1fr}.education-columns{grid-template-columns:1fr}.role-layout{grid-template-columns:240px 1fr}}
@media(max-width:760px){:root{--sidebar:270px}.sidebar{transform:translateX(-101%);transition:transform .22s ease;box-shadow:10px 0 36px rgba(12,31,24,.13)}.sidebar.open{transform:translateX(0)}.sidebar-close{display:grid;margin-left:auto;color:#d4e0d8}.sidebar-shade{display:none;position:fixed;inset:0;background:rgba(16,30,23,.34);z-index:19}.sidebar-shade.visible{display:block}.main-area{margin-left:0}.topbar{height:58px;padding:0 14px}.menu-toggle{display:grid;margin-right:8px}.breadcrumb{margin-right:auto}.topbar-actions{gap:9px}.connection-pill{display:none}.profile-chip{padding-left:9px}.profile-meta{display:none}.logout-button{width:30px}.page-content{padding:21px 14px 34px}.page-footer{padding:12px 14px;font-size:9px}.page-footer>span:first-child{display:none}.page-heading{margin-bottom:17px}.page-heading h1{font-size:21px}.page-heading p{font-size:11px}.page-heading .button-row{justify-content:flex-end}.stats-grid{gap:9px}.stat-card{padding:13px;min-height:98px}.stat-number{font-size:23px;margin-top:11px}.dashboard-lower{grid-template-columns:1fr}.toolbar{align-items:stretch}.toolbar-left,.toolbar-right{width:100%}.toolbar-right{justify-content:flex-start}.search-box{flex:1}.search-box input{width:100%}.table-wrap{overflow:visible}.data-table{min-width:0}.data-table thead{display:none}.data-table,.data-table tbody,.data-table tr,.data-table td{display:block;width:100%}.data-table tbody tr{border-bottom:1px solid var(--line);padding:8px 12px}.data-table tbody tr:last-child{border-bottom:0}.data-table td{padding:5px 0;border:0;white-space:normal;display:flex;justify-content:space-between;gap:12px;align-items:center;text-align:right}.data-table td:before{content:attr(data-label);font-size:9px;color:#929e96;text-align:left;flex:0 0 92px}.data-table td[data-primary="true"]{display:block;text-align:left;padding:4px 0 8px}.data-table td[data-primary="true"]:before{display:none}.data-table td.action-cell{justify-content:flex-end}.data-table td.action-cell:before{display:none}.table-foot{gap:8px}.module-grid{grid-template-columns:1fr}.education-columns{grid-template-columns:1fr}.role-layout{grid-template-columns:1fr}.role-list{display:flex;overflow:auto;gap:5px}.role-option{min-width:160px}.permission-grid{grid-template-columns:1fr}.permission-module{grid-column:1}.login-screen{display:flex;flex-direction:column;min-height:100vh}.login-visual{display:none}.login-panel{padding:30px 23px 20px;min-height:100vh}.mobile-brand{display:flex;align-items:center;gap:10px;margin:0 0 auto}.mobile-brand .brand-mark{width:35px;height:35px;font-size:21px}.mobile-brand div:last-child{display:flex;flex-direction:column}.mobile-brand strong{font-size:13px;letter-spacing:.08em}.mobile-brand small{font-size:9px;color:var(--muted)}.login-form{margin:45px auto auto}.login-copyright{margin-top:60px}.modal{max-height:93vh;border-radius:12px 12px 0 0;width:100vw;max-width:100vw;margin:auto 0 0}.modal-form{grid-template-columns:1fr}.modal-form .form-field.full-span{grid-column:1}.detail-grid{grid-template-columns:1fr 1fr}.connection-pill{display:none}.education-columns .panel{min-width:0}.role-layout>.panel{min-width:0}}
@media(max-width:390px){.stats-grid{grid-template-columns:1fr 1fr}.stat-top{font-size:10px}.stat-number{font-size:21px}.page-heading{align-items:flex-start}.page-heading .button{padding:8px 9px}.detail-grid{grid-template-columns:1fr}.quick-links{grid-template-columns:1fr 1fr}.table-foot{font-size:9px}.topbar{padding:0 10px}.page-content{padding-left:11px;padding-right:11px}}
@media print{.sidebar,.topbar,.page-footer,.toolbar,.row-actions,.panel-header .button,.button{display:none!important}.main-area{margin:0}.page-content{padding:0}.panel{border:0;box-shadow:none}.data-table{display:table!important}.data-table thead{display:table-header-group}.data-table tbody{display:table-row-group}.data-table tr{display:table-row!important;break-inside:avoid}.data-table td,.data-table th{display:table-cell!important;font-size:9px;padding:5px;border:1px solid #ddd}.data-table td:before{display:none!important}}

/* Modern klasik PPMS: hangat, tenang, dan berakar pada identitas pesantren */
:root{color-scheme:light;--ink:#202b25;--muted:#718077;--line:#e5e2d8;--canvas:#f5f3ec;--panel:#fffdf8;--green:#173d33;--green-2:#315b4d;--mint:#edf2eb;--gold:#b69b64;--red:#a84940;--amber:#9b6d28;--accent:#b69b64;--accent-soft:rgba(182,155,100,.12);--sidebar:254px}
html{scroll-behavior:smooth}
body{color:var(--ink);background:radial-gradient(ellipse at 92% 0%,rgba(194,178,132,.09),transparent 34%),#f5f3ec}
::selection{background:rgba(182,155,100,.25);color:#173d33}
:focus-visible{outline:2px solid #b69b64;outline-offset:2px}
.sidebar{background:linear-gradient(180deg,#193f35,#15382f);border-right:1px solid rgba(218,200,153,.18);box-shadow:5px 0 20px rgba(37,48,39,.05);padding-top:24px}
.brand{border-bottom-color:rgba(230,219,187,.16)}
.brand-mark{background:#234d40;color:#e0ca92;border-color:rgba(224,202,146,.4);box-shadow:inset 0 1px rgba(255,255,255,.08)}
.brand-copy span{color:#b5c7bb}
.sidebar-label{color:#a4b7aa}
.nav-link{color:#d0dbd3;border-radius:8px}
.nav-link:hover{background:rgba(255,255,255,.07);color:#fffdf5}
.nav-link.active{background:rgba(255,255,255,.1);color:#fffdf5;box-shadow:inset 0 0 0 1px rgba(230,219,187,.08)}
.nav-link.active:before{left:-15px;background:#d2b875}
.nav-icon{color:#b4c7b8}
.nav-link.active .nav-icon{color:#e0ca92}
.sidebar-note{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.06);color:#d6e0d7;border-radius:8px}
.status-dot{background:#87b38d;box-shadow:0 0 0 3px rgba(135,179,141,.13)}
.sidebar-version{border-top-color:rgba(230,219,187,.16);color:#cfdbd1}
.sidebar-version span{color:#a8bcad}
.main-area{background:transparent}
.topbar{background:rgba(255,253,248,.94);border-bottom:1px solid #e5e2d8;backdrop-filter:blur(12px);box-shadow:0 3px 14px rgba(39,51,42,.035)}
.breadcrumb{color:#829087}
.breadcrumb strong{color:#26342c}
.crumb-sep{color:#b7b9ad}
.connection-pill{color:#68766d}
.profile-chip{border-left-color:#e5e2d8}
.avatar{background:#e9efe7;color:#315b4d;border:1px solid #dce5db}
.profile-meta span{color:#758278}
.icon-button{color:#718077}
.icon-button:hover{background:#edf1ea;color:#23362b}
.page-footer{color:#92998f}
.page-footer #offline-indicator{color:#9b6d28}
.page-heading h1{color:#20352a;font-family:Georgia,"Times New Roman",serif;font-weight:600;letter-spacing:-.025em}
.page-heading p{color:#758178}
.eyebrow{color:#8b7442;letter-spacing:.16em}
.button{border-radius:7px;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease}
.button:hover{transform:translateY(-1px)}
.button.primary{background:#1c493b;color:#fffdf7;box-shadow:0 2px 5px rgba(23,61,51,.13);font-weight:600}
.button.primary:hover{background:#285a49;box-shadow:0 4px 10px rgba(23,61,51,.16)}
.button.secondary{background:#fffdf8;border-color:#dcded4;color:#34483b}
.button.secondary:hover{background:#f7f7f0;border-color:#bdc7b9}
.button.subtle{background:#eef2e9;color:#315747;border:1px solid #e2e9df}
.button.danger{background:#fff4f1;color:#a84940;border-color:#eed8d2}
.stat-card{position:relative;overflow:hidden;background:linear-gradient(145deg,#fffefb,#fbfaf4);border:1px solid #e5e2d8;border-radius:11px;box-shadow:0 3px 10px rgba(35,48,38,.035);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.stat-card:before{content:"";position:absolute;right:0;top:0;width:3px;height:42px;background:linear-gradient(#c4aa70,transparent);pointer-events:none}
.stat-card:hover{transform:translateY(-2px);border-color:#d6ceb8;box-shadow:0 7px 18px rgba(35,48,38,.07)}
.stat-top,.stat-number,.stat-hint{position:relative}
.stat-top{color:#718077}
.stat-icon{background:#edf2e9;color:#466b54;border:1px solid #e3eadd;border-radius:8px}
.stat-number{color:#24382c}
.stat-hint{color:#8a948a}
.panel{background:#fffdf8;border:1px solid #e5e2d8;border-radius:11px;box-shadow:0 3px 10px rgba(35,48,38,.035)}
.panel-header{border-bottom-color:#eeece4}
.panel-title{color:#28392f}
.panel-subtitle{color:#7b877e}
.activity-item{border-bottom-color:#efede6}
.activity-marker{background:#edf2e9;color:#4f745b;border:1px solid #e3eadd}
.activity-copy strong{color:#33443a}
.activity-copy span,.activity-time{color:#879188}
.quick-link{background:#fffefa;border-color:#e4e5dc;border-radius:8px;color:#2a3b31;transition:.16s ease}
.quick-link:hover{border-color:#c9d2c5;background:#f8f8f2;box-shadow:0 3px 10px rgba(35,48,38,.05)}
.quick-link-icon{background:#edf2e9;color:#4d7058;border:1px solid #e3eadd}
.quick-link strong{color:#2f4235}
.quick-link small{color:#7e8a80}
.toolbar{color:#56645b}
.search-icon{color:#919b91}
.field,input,select,textarea{background:#fffefa;border-color:#dfe3d9;color:#25362c;border-radius:6px}
input:focus,select:focus,textarea:focus{border-color:#8ea88f;box-shadow:0 0 0 3px rgba(75,122,82,.11)}
input::placeholder,textarea::placeholder{color:#a0a79d}
.filter-select{color:#536159}
.data-table th{background:#f7f7f1;color:#7e897f;border-bottom-color:#e9e9e0}
.data-table td{color:#394740;border-bottom-color:#efeee8}
.data-table tbody tr:hover{background:#fafbf7}
.table-avatar{background:#edf2e9;color:#4c7057;border:1px solid #e3eadd}
.table-main strong{color:#33443a}
.table-main small,.muted{color:#879188}
.empty-state{color:#879188}
.empty-state .empty-icon{color:#aab8a8}
.empty-state strong{color:#4b5b4f}
.badge{background:#eef2ed;color:#5d7162;border:1px solid rgba(49,91,77,.04)}
.badge.active,.badge.success{color:#36754c;background:#eaf4e9;border-color:#e0eddf}
.badge.graduated{color:#536b99;background:#eef1f8}
.badge.withdrawn,.badge.deceased{color:#7c8580;background:#f0f2ef}
.badge.suspended{color:#95691e;background:#fff5e4}
.badge.female{color:#86587e;background:#f7edf5}
.badge.male{color:#4d6c90;background:#edf3f8}
.row-action{color:#75837a}
.row-action:hover{background:#edf3ee;color:#315c4e}
.table-foot{color:#929d94;border-top-color:#efeee8}
.form-card h3{color:#304136}
.form-card>p,.field-help{color:#7c887e}
.form-field label,.modal-form label{color:#4d5a52}
.section-title{color:#69796f;border-top-color:#edf0ed}
.tree-row,.compact-row{border-bottom-color:#efeee8;color:#394740}
.tree-icon{color:#668a75}
.tree-main strong,.compact-row-copy strong{color:#3a4b40}
.tree-main small,.compact-row-copy small{color:#88948b}
.tree-capacity{color:#748178}
.compact-initial{background:#edf3ef;color:#4d725c;border:1px solid #e4ebe3}
.role-option{color:#33433a}
.role-option:hover,.role-option.selected{background:#eef4f0;box-shadow:inset 0 0 0 1px #e3eae1}
.role-option small{color:#88948d}
.permission-item{color:#405046}
.permission-module{color:#829087}
.permission-item input{accent-color:#315c4e}
.summary-pill{border-color:#e2e4db;background:#fffefa;color:#65736b}
.summary-pill strong{color:#304338}
.modal{background:#fffdf8;color:#26342b;border:1px solid #e5e2d8;box-shadow:0 20px 70px rgba(24,39,29,.2)}
.modal::backdrop{background:rgba(25,36,29,.42);backdrop-filter:blur(2px)}
.modal-head{background:#fffdf8;border-bottom-color:#e8e7df}
.modal-head h2{color:#25372d}
.modal-head p{color:#78847a}
.modal-footer{background:#fffdf8;border-top-color:#e8e7df}
.detail-item{border-color:#e9ece5;background:#fbfbf7}
.detail-item small{color:#879389}
.detail-item strong{color:#3b4b41}
.detail-section{color:#506256}
.document-row,.history-row{border-bottom-color:#eff1eb;color:#536159}
.toast{background:#214b3d;color:#fffdf7;border:1px solid rgba(23,61,51,.1);box-shadow:0 8px 26px rgba(23,61,51,.18)}
.toast.error{background:#9a3832}
.toast.info{background:#455d50}
.form-error{color:#a23832;background:#fff2f0;border:1px solid #f0d6d2}
.login-screen{background:#f7f5ed;color:#26352b;position:relative;isolation:isolate}
.login-screen:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 52% 42%,rgba(190,174,129,.1),transparent 48%),linear-gradient(rgba(49,91,77,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(49,91,77,.025) 1px,transparent 1px);background-size:auto,48px 48px,48px 48px;mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.7) 55%,transparent 100%)}
.login-visual{background:radial-gradient(ellipse at 78% 35%,rgba(181,157,99,.17),transparent 43%),linear-gradient(145deg,#173d33,#204a3c 65%,#183b32);border-right:1px solid rgba(182,155,100,.27)}
.login-visual:after{border:0;box-shadow:none}
.login-visual .eyebrow{color:#e0ca92}
.login-visual h1{color:#fffdf5;text-shadow:0 2px 14px rgba(0,0,0,.12)}
.login-description{color:#c7d5cb}
.login-foot{color:#afc0b4}
.login-panel{background:rgba(255,253,248,.76)}
.login-form h2{color:#24382c;font-family:Georgia,"Times New Roman",serif;font-weight:600}
.login-form>p{color:#718077}
.login-form label{color:#405046}
.login-form input{background:#fffefa;border-color:#dfe3d9;color:#25362c}
.login-secure{color:#7f8c82}
.login-secure span{color:#668b6c}
.login-copyright{color:#92998f}
.mobile-brand small{color:#758278}
.offline-page{background:#f5f3ec}
.offline-card{background:#fffdf8;border-color:#e5e2d8;box-shadow:0 12px 40px rgba(35,48,38,.08);color:#26342b}
.offline-card h1{color:#293b30}
.offline-card p:not(.eyebrow){color:#718077}
.skeleton{background:linear-gradient(90deg,#eff1eb,#fafbf8,#eff1eb);background-size:200% 100%}
.offline-overlay{background:#fff5e4;color:#805410;border:1px solid #f0dfb6}
@media(max-width:760px){.sidebar{box-shadow:10px 0 36px rgba(16,31,23,.2)}.sidebar-shade.visible{background:rgba(20,34,27,.36)}.mobile-brand .brand-mark{box-shadow:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
@media print{body,.main-area,.page-content{background:#fff!important;color:#111!important}.sidebar,.topbar,.page-footer,.toolbar,.row-actions,.panel-header .button,.button{display:none!important}.panel,.stat-card{background:#fff!important;color:#111!important;border:0!important;box-shadow:none!important}.data-table th,.data-table td{background:#fff!important;color:#111!important}}

/* Perpaduan klasik pesantren dan teknologi modern */
:root{
  --ink:#24332a;
  --muted:#78857b;
  --line:#e3e5db;
  --canvas:#f4f3ec;
  --panel:#fffdf8;
  --green:#183f34;
  --green-2:#2d5a49;
  --mint:#eaf1e8;
  --gold:#b99b5c;
  --accent:#548c72;
  --accent-soft:rgba(84,140,114,.12);
}
body{
  background:
    radial-gradient(ellipse at 88% 2%,rgba(197,177,123,.12),transparent 28%),
    radial-gradient(ellipse at 6% 96%,rgba(60,112,84,.055),transparent 33%),
    #f4f3ec;
}
.sidebar{
  background:
    radial-gradient(ellipse at 95% 4%,rgba(198,170,103,.12),transparent 31%),
    linear-gradient(180deg,#1a4538 0%,#163b31 58%,#123329 100%);
  border-right:1px solid rgba(207,181,120,.3);
  box-shadow:8px 0 28px rgba(22,49,36,.08);
}
.sidebar:after{content:"";position:absolute;right:-1px;top:85px;width:44px;height:170px;pointer-events:none;opacity:.22;background-image:var(--moon-stars);background-size:44px 44px;background-repeat:repeat-y;mask-image:linear-gradient(#000,transparent)}
.brand{border-bottom-color:rgba(228,211,164,.2)}
.brand-mark{background:linear-gradient(145deg,#2d604d,#204536);color:#ead8a8;border-color:rgba(224,202,146,.48);box-shadow:0 4px 14px rgba(5,22,14,.2),inset 0 1px rgba(255,255,255,.16)}
.sidebar-label{color:#b6c9b9}
.nav-link{border-radius:9px;transition:background .2s ease,color .2s ease,transform .2s ease}
.nav-link:hover{background:rgba(255,255,255,.075);transform:translateX(2px)}
.nav-link.active{background:linear-gradient(100deg,rgba(209,188,130,.2),rgba(255,255,255,.075));box-shadow:inset 0 0 0 1px rgba(221,203,158,.12)}
.nav-link.active:before{background:linear-gradient(180deg,#eedba7,#b79b5e);box-shadow:0 0 9px rgba(222,199,139,.35)}
.nav-link.active .nav-icon{color:#e4d09c}
.sidebar-note{border-color:rgba(222,207,166,.1);background:rgba(255,255,255,.055)}
.status-dot{background:#91bd91;box-shadow:0 0 0 3px rgba(145,189,145,.12),0 0 10px rgba(145,189,145,.28)}
.topbar{background:rgba(255,253,248,.88);backdrop-filter:blur(16px);box-shadow:0 5px 20px rgba(35,51,39,.045)}
.page-heading{position:relative}
.page-heading:after{content:"";position:absolute;left:0;bottom:-12px;width:62px;height:1px;background:linear-gradient(90deg,#b99b5c,rgba(185,155,92,0));}
.page-heading h1{color:#203c2e;text-shadow:0 1px rgba(255,255,255,.65)}
.eyebrow{color:#8d7745}
.button{border-radius:8px}
.button.primary{background:linear-gradient(135deg,#1e4b3b,#2e644d);box-shadow:0 3px 9px rgba(27,70,52,.16),inset 0 1px rgba(255,255,255,.16)}
.button.primary:hover{background:linear-gradient(135deg,#285c46,#397457);box-shadow:0 5px 13px rgba(27,70,52,.2)}
.button.secondary{box-shadow:0 1px 2px rgba(33,48,38,.035)}
.stat-card,.panel{border-color:#e2e4da;box-shadow:0 5px 16px rgba(34,50,39,.045),inset 0 1px rgba(255,255,255,.85)}
.stat-card{background:linear-gradient(145deg,#fffefa,#faf9f2)}
.stat-card:before{width:3px;height:48px;background:linear-gradient(#c4aa70,rgba(196,170,112,0))}
.stat-card:after{content:"";position:absolute;right:10px;bottom:5px;width:54px;height:54px;pointer-events:none;background-image:var(--moon-stars);background-size:contain;background-repeat:no-repeat;opacity:.42}
.stat-card:hover{border-color:#c9d4c8;box-shadow:0 8px 22px rgba(34,50,39,.075),0 0 0 1px rgba(185,155,92,.08)}
.stat-icon{background:linear-gradient(145deg,#edf3e9,#e5eee4);color:#426e52;border-color:#e0e9de}
.panel{background:linear-gradient(155deg,#fffefa,#fffdf7)}
.panel-header{background:linear-gradient(90deg,rgba(239,241,231,.55),transparent);border-bottom-color:#e9e9df}
.activity-marker{box-shadow:inset 0 1px rgba(255,255,255,.8)}
.quick-link{box-shadow:0 2px 5px rgba(35,48,38,.025)}
.quick-link:hover{transform:translateY(-1px)}
input:focus,select:focus,textarea:focus{border-color:#8eaa91;box-shadow:0 0 0 3px rgba(82,133,91,.1)}
.data-table th{background:#f3f4ec;color:#788477}
.data-table tbody tr:hover{box-shadow:inset 3px 0 #c6ad72}
.table-avatar{box-shadow:inset 0 1px rgba(255,255,255,.8)}
.badge.active,.badge.success{box-shadow:inset 0 1px rgba(255,255,255,.8)}
.modal{box-shadow:0 24px 75px rgba(23,41,29,.23),0 0 0 1px rgba(185,155,92,.08)}
.toast{background:linear-gradient(135deg,#1b4939,#2d5b47);box-shadow:0 9px 28px rgba(24,63,49,.2)}
.login-screen{background:#f5f3ea}
.login-screen:before{
  background:
    radial-gradient(ellipse at 48% 48%,rgba(190,174,129,.12),transparent 47%),
    linear-gradient(45deg,transparent 48%,rgba(49,91,77,.026) 49%,rgba(49,91,77,.026) 51%,transparent 52%),
    linear-gradient(-45deg,transparent 48%,rgba(49,91,77,.026) 49%,rgba(49,91,77,.026) 51%,transparent 52%);
  background-size:auto,36px 36px,36px 36px;mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.72) 58%,transparent 100%);
}
.login-visual{
  background:
    radial-gradient(ellipse at 76% 32%,rgba(193,164,97,.2),transparent 38%),
    linear-gradient(145deg,#193f34 0%,#214c3b 58%,#173a30 100%);
}
.login-visual:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.18;background-image:var(--moon-stars);background-size:128px 128px;background-repeat:repeat;mask-image:radial-gradient(ellipse at 78% 48%,#000,transparent 67%)}
.login-visual:after{border:0;box-shadow:none}
.login-visual .eyebrow{color:#e3cd93}
.login-visual h1{font-size:51px;letter-spacing:-.02em;text-shadow:0 3px 20px rgba(0,0,0,.16)}
.login-panel{background:rgba(255,253,248,.79);backdrop-filter:blur(8px)}
.login-form input{background:rgba(255,254,250,.88)}
.login-form .button.primary{min-height:44px}
.login-secure span{color:#77966f}
.offline-card{box-shadow:0 16px 45px rgba(34,50,39,.09)}
@media(max-width:760px){
  .sidebar:after{right:0;top:75px;width:38px;height:145px}
  .page-heading:after{bottom:-9px;width:48px}
  .login-screen:before{background-size:auto,30px 30px,30px 30px}
}
@media(prefers-reduced-motion:reduce){.nav-link:hover,.quick-link:hover{transform:none}}

/* Navigasi bawah ponsel dan menu profil */
.profile-menu{position:relative;z-index:12}
.profile-chip{appearance:none;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;text-align:left;border-radius:9px;transition:background .16s ease}
.profile-chip:hover,.profile-chip[aria-expanded="true"]{background:#f1f3eb}
.profile-chip:focus-visible,.profile-logout:focus-visible,.mobile-nav-link:focus-visible,.mobile-more-link:focus-visible{outline:3px solid rgba(185,155,92,.4);outline-offset:2px}
.profile-chevron{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;color:#879187;transition:transform .16s ease}
.profile-chip[aria-expanded="true"] .profile-chevron{transform:rotate(180deg)}
.profile-menu-popup{position:absolute;right:0;top:calc(100% + 9px);width:230px;padding:13px;background:#fffdf8;border:1px solid #e5e2d8;border-radius:13px;box-shadow:0 14px 34px rgba(31,47,36,.16);animation:profile-popup-in .16s ease;transform-origin:top right}
.profile-menu-popup[hidden]{display:none}
.profile-popup-heading{font-size:9px;letter-spacing:.13em;text-transform:uppercase;font-weight:700;color:#8a7444}
.profile-popup-identity{display:flex;flex-direction:column;gap:3px;padding:9px 0 12px;border-bottom:1px solid #eeece4}
.profile-popup-identity strong{font-size:12px;color:#28392f}
.profile-popup-identity span{font-size:10px;color:#7b877e}
.profile-logout{width:100%;display:flex;align-items:center;gap:9px;margin-top:10px;padding:9px 10px;border:1px solid transparent;border-radius:8px;background:#fff5f1;color:#a84940;font:inherit;font-size:11px;font-weight:600;text-align:left;cursor:pointer}
.profile-logout:hover{background:#ffebe6;border-color:#f0d7d1}
.profile-logout .ui-icon{width:17px;height:17px}
.mobile-navigation{display:none}
.mobile-more-shade{display:none}
.mobile-more-panel{display:none}
@keyframes profile-popup-in{from{opacity:0;transform:translateY(-4px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:760px){
  .sidebar,.sidebar-shade{display:none!important}
  .menu-toggle{display:none!important}
  .main-area{margin-left:0;min-height:100vh}
  .topbar{height:60px;padding:0 15px}
  .breadcrumb{margin-left:0}
  .topbar-actions{gap:7px}
  .profile-menu{z-index:45}
  .profile-chip{gap:6px;padding:4px;border:0}
  .profile-chip .avatar{width:34px;height:34px}
  .profile-chevron{width:12px;height:12px}
  .profile-menu-popup{top:calc(100% + 8px);width:min(250px,calc(100vw - 24px))}
  .page-content{padding:19px 14px calc(26px + env(safe-area-inset-bottom))}
  .page-footer{padding:12px 14px calc(88px + env(safe-area-inset-bottom));font-size:9px}
  .mobile-navigation{position:fixed;z-index:40;inset:auto 0 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:stretch;gap:2px;height:calc(70px + env(safe-area-inset-bottom));padding:7px 8px calc(7px + env(safe-area-inset-bottom));background:rgba(255,253,248,.97);border-top:1px solid rgba(223,222,211,.95);box-shadow:0 -7px 24px rgba(34,48,37,.09);backdrop-filter:blur(16px);}
  .mobile-nav-link{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:4px 2px;border:0;border-radius:12px;background:transparent;color:#718077;font:500 9px/1.1 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;white-space:nowrap;cursor:pointer;transition:background .16s ease,color .16s ease,transform .16s ease;}
  .mobile-nav-link:hover{color:#315747;background:#f0f3eb}
  .mobile-nav-link.active{color:#244f3d;font-weight:700;background:linear-gradient(180deg,rgba(231,239,226,.86),rgba(241,243,234,.64));}
  .mobile-nav-icon{display:grid;place-items:center;width:29px;height:25px;border-radius:9px;color:#78877b;transition:background .16s ease,color .16s ease}
  .mobile-nav-icon .ui-icon{width:20px;height:20px;stroke-width:1.8}
  .mobile-nav-link.active .mobile-nav-icon{background:#e1eadc;color:#315d46}
  .mobile-more-shade{display:block;position:fixed;z-index:30;inset:0;background:rgba(24,39,30,.2);backdrop-filter:blur(2px);opacity:0;visibility:hidden;transition:opacity .18s ease,visibility .18s ease}
  .mobile-more-shade.visible{opacity:1;visibility:visible}
  .mobile-more-panel{display:block;position:fixed;z-index:35;left:12px;right:12px;bottom:calc(78px + env(safe-area-inset-bottom));max-height:min(54vh,420px);overflow:auto;padding:12px;background:#fffdf8;border:1px solid #e5e2d8;border-radius:17px;box-shadow:0 18px 50px rgba(28,44,33,.22);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(10px) scale(.99);transform-origin:bottom center;transition:opacity .18s ease,transform .18s ease,visibility .18s ease}
  .mobile-more-panel.open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0) scale(1)}
  .mobile-more-heading{display:flex;align-items:center;justify-content:space-between;padding:2px 3px 10px 8px;border-bottom:1px solid #eeece4;color:#35463a;font:600 12px Georgia,"Times New Roman",serif}
  .mobile-more-heading .icon-button{width:30px;height:30px;color:#738078}
  .mobile-more-heading .ui-icon{width:17px;height:17px}
  .mobile-more-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding-top:10px}
  .mobile-more-link{min-width:0;display:flex;align-items:center;gap:8px;padding:10px 9px;border:1px solid #e9e9df;border-radius:10px;background:#fffefa;color:#3a4d3e;font:500 10px Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;text-align:left;cursor:pointer}
  .mobile-more-link:hover,.mobile-more-link.active{background:#edf2e8;border-color:#d8e2d4;color:#244f3d}
  .mobile-more-icon{display:grid;place-items:center;width:29px;height:29px;flex:none;border-radius:9px;background:#eef2e9;color:#52745a}
  .mobile-more-icon .ui-icon{width:18px;height:18px}
  .mobile-more-link.active{font-weight:700}
  .mobile-more-current{margin-left:auto;color:#70836e;font-size:8px}
}
@media(max-width:360px){
  .mobile-navigation{padding-left:4px;padding-right:4px}
  .mobile-nav-link{font-size:8px}
  .mobile-nav-icon{height:23px}
  .mobile-nav-icon .ui-icon{width:19px;height:19px}
}
@media(prefers-reduced-motion:reduce){.profile-menu-popup{animation:none}.mobile-more-panel,.mobile-more-shade,.mobile-nav-link,.profile-chevron{transition:none}}
@media(max-width:760px){
  .login-screen{min-height:100svh;background:#f4f3ec}
  .login-visual{display:flex;min-height:230px;padding:23px 24px 52px;justify-content:flex-start}
  .login-visual .brand-mark.large{width:45px;height:45px;border-radius:13px;font-size:27px}
  .login-visual .eyebrow{margin:14px 0 5px;font-size:8px}
  .login-visual h1{font-size:26px;line-height:1.08;margin:0 0 7px;max-width:360px}
  .login-description{font-size:10px;line-height:1.45;max-width:350px;margin:0}
  .login-foot,.mobile-brand{display:none}
  .login-visual:after{width:280px;height:280px;right:-125px;top:-38px}
  .login-panel{position:relative;z-index:1;min-height:calc(100svh - 204px);margin-top:-29px;padding:27px 24px 19px;border-radius:20px 20px 0 0;background:rgba(255,253,248,.97);box-shadow:0 -5px 24px rgba(25,53,38,.1);justify-content:flex-start}
  .login-form{margin:14px auto 0;max-width:370px}
  .login-form h2{font-size:25px}
  .login-form>p{margin:6px 0 20px}
  .login-copyright{margin-top:auto;padding-top:24px}
}
.page-heading{
  isolation:isolate;overflow:hidden;padding:17px 19px;border:1px solid rgba(57,100,73,.13);border-radius:12px;
  background:linear-gradient(112deg,rgba(235,242,231,.96),rgba(250,247,237,.96) 70%,rgba(244,239,222,.9));
  box-shadow:inset 0 1px rgba(255,255,255,.85),0 4px 13px rgba(39,59,43,.035);
}
.page-heading>div,.page-heading>.button-row{position:relative;z-index:1}
.page-heading:before{content:"";position:absolute;z-index:0;right:9%;top:50%;width:90px;height:90px;transform:translate(50%,-50%);background-image:var(--moon-stars);background-position:center;background-repeat:no-repeat;background-size:82px 82px;opacity:.7;pointer-events:none}
.page-heading:after{left:19px;bottom:7px;width:46px;opacity:.68}
@media(max-width:760px){.page-heading{padding:15px 16px}.page-heading:before{right:12%;width:78px;height:78px;opacity:.53}.page-heading:after{left:16px;bottom:4px}}
.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}
.ui-icon{display:inline-block;width:1.15em;height:1.15em;flex:0 0 auto;vertical-align:-.2em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.nav-icon .ui-icon{width:19px;height:19px;vertical-align:middle;stroke-width:1.7}
.stat-icon .ui-icon,.quick-link-icon .ui-icon,.activity-marker .ui-icon,.empty-icon .ui-icon,.tree-icon .ui-icon,.table-avatar .ui-icon,.search-icon .ui-icon{width:19px;height:19px;vertical-align:middle}
.empty-icon .ui-icon{width:30px;height:30px;stroke-width:1.55}

/* Identitas Pondok Pesantren Salafiyah Syafi'iyah Al-Asror */
.institution-logo{display:block;flex:none;object-fit:cover;border-radius:50%;background:#fff;border:2px solid rgba(214,190,126,.9);box-shadow:0 5px 18px rgba(10,26,17,.2)}
.institution-arabic{font-family:"Geeza Pro","Noto Naskh Arabic","Times New Roman",serif;direction:rtl;unicode-bidi:isolate;line-height:1.65}
.sidebar .brand{height:auto;min-height:62px;padding:0 4px 16px;gap:10px}
.sidebar-logo{width:43px;height:43px}
.sidebar .brand-copy{min-width:0;gap:2px}
.sidebar .brand-copy strong{font-size:14px;letter-spacing:.035em;color:#fffdf5}
.sidebar .brand-copy span{margin-top:0;line-height:1.25}
.sidebar .brand-copy .sidebar-arabic{font-size:8px;color:#e3d5ac;white-space:nowrap;margin-top:3px}
.breadcrumb-logo{width:25px;height:25px;object-fit:cover;border-radius:50%;border:1px solid #c7ae71;background:#fff}
.login-brand-lockup{display:flex;align-items:center;gap:21px;position:relative;z-index:1}
.login-logo{width:88px;height:88px;border-width:3px}
.login-brand-copy{min-width:0}
.login-brand-copy .eyebrow{margin:0 0 7px;color:#e3cd93}
.login-visual h1{font-family:Georgia,"Times New Roman",serif;font-size:39px;line-height:1.1;letter-spacing:-.025em;margin:0;color:#fffdf5}
.login-arabic{font-size:18px;color:#e5d09a;margin-top:11px;text-align:left}
.institution-english{position:relative;z-index:1;color:#e2d7b8;font:500 11px/1.5 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:.075em;text-transform:uppercase;margin:25px 0 8px}
.login-description{position:relative;z-index:1;max-width:405px;line-height:1.75}
.login-foot{z-index:1}
.offline-logo{width:80px;height:80px;margin:0 auto 20px}
@media(max-width:760px){
  .sidebar .brand{min-height:55px}
  .breadcrumb{gap:7px}
  .breadcrumb-logo{width:23px;height:23px}
  .login-visual{min-height:0;padding:23px 22px 51px;gap:0}
  .login-brand-lockup{gap:12px;align-items:flex-start}
  .login-logo{width:55px;height:55px;border-width:2px}
  .login-brand-copy .eyebrow{font-size:8px;margin:0 0 4px}
  .login-visual h1{font-size:23px;line-height:1.08;margin:0}
  .login-arabic{font-size:12px;line-height:1.7;margin-top:7px;max-width:260px}
  .institution-english{font-size:8px;letter-spacing:.06em;margin:14px 0 6px}
  .login-description{font-size:10px;line-height:1.5;max-width:390px}
  .offline-logo{width:72px;height:72px}
}
.search-icon{display:inline-flex;align-items:center;justify-content:center}
.icon-button .ui-icon{width:19px;height:19px;vertical-align:middle}
.sidebar-close .ui-icon{width:18px;height:18px}
.wizard-step .ui-icon{width:13px;height:13px}
.button .ui-icon{width:16px;height:16px;margin-right:3px;vertical-align:-.23em}
.row-action .ui-icon{width:14px;height:14px}

/* Bintang dan bulan sabit sebagai ornamen pesantren */
:root{--moon-stars:url('/moon-star.svg')}
.sidebar:after{right:12px;top:auto;bottom:92px;width:68px;height:68px;background-image:var(--moon-stars);background-size:contain;background-repeat:no-repeat;opacity:.14;mask-image:none}
.login-visual:before{content:none}
.login-visual:after{content:"";z-index:0;width:280px;height:280px;right:4%;top:50%;transform:translateY(-50%);border:0;border-radius:0;box-shadow:none;background-image:var(--moon-stars);background-repeat:no-repeat;background-position:center;background-size:contain;opacity:.22}
.page-heading:before{border:0;box-shadow:none;background-image:var(--moon-stars);background-repeat:no-repeat;background-position:center;background-size:82px 82px;opacity:.18}
.stat-card:after{right:10px;bottom:5px;width:54px;height:54px;border:0;border-radius:0;box-shadow:none;background-image:var(--moon-stars);background-repeat:no-repeat;background-position:center;background-size:contain;opacity:.16}
@media(max-width:760px){.sidebar:after{right:8px;top:auto;bottom:94px;width:54px;height:54px;opacity:.12}.login-visual:after{width:145px;height:145px;right:-24px;top:8px;transform:none;opacity:.14}.page-heading:before{background-size:66px 66px}}

/* On desktop, let the main module surface use the remaining viewport height. */
@media(min-width:761px){
  .page-content{display:flex;flex-direction:column;min-height:0}
  .page-content>:last-child{flex:1 1 auto;min-height:0}
  .page-content>:last-child .panel{display:flex;flex-direction:column;height:100%;min-height:0}
  .page-content>:last-child .panel>.table-wrap,
  .page-content>:last-child .panel>.room-tree,
  .page-content>:last-child .panel>.compact-list,
  .page-content>:last-child .panel>.activity-list,
  .page-content>:last-child .panel>.quick-links{flex:1 1 auto;min-height:0}
}

@media(min-width:761px){
  .breadcrumb-logo,.breadcrumb>span:not(.crumb-sep),.breadcrumb .crumb-sep{display:none}
}

/* Keep the Pendidikan panels aligned on wide desktop layouts. */
@media(min-width:1121px){
  .education-columns{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
  .education-columns>div{display:flex;min-width:0}
  .education-columns>div>.panel{display:flex;flex:1 1 auto;flex-direction:column;min-width:0}
  .education-columns .panel>.compact-list,
  .education-columns .panel>.table-wrap{flex:1 1 auto;min-height:0}
}