:root{--navy:#071c35;--navy-2:#0b3563;--blue:#1256a0;--cyan:#16b9e9;--bg:#f4f7fb;--line:#e3eaf2;--text:#18243a;--muted:#718096;--white:#fff;--danger:#dc2626;--success:#087c57;font-family:Tahoma,Arial,sans-serif;color:var(--text);background:var(--bg)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}button,input,textarea,select{font:inherit}button,a{transition:.18s ease}a{text-decoration:none;color:inherit}.muted{color:var(--muted);line-height:1.9}.brand{display:flex;align-items:center;gap:12px}.brand span:last-child{display:flex;flex-direction:column}.brand b{font-size:19px}.brand small,.sidebar-brand small{font-size:11px;color:#6d8099;margin-top:5px}.brand-mark{display:grid;place-items:center;width:52px;height:52px;border-radius:17px;background:var(--navy);color:#fff;font-size:31px;font-weight:900}.brand-mark.light{background:#fff;color:var(--navy)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border:0;border-radius:13px;cursor:pointer;font-weight:800}.btn-primary{background:var(--blue);color:#fff;box-shadow:0 10px 22px rgba(18,86,160,.14)}.btn-primary:hover{background:#0d477f}.btn-outline{border:1px solid var(--line);background:#fff;color:var(--navy-2)}.btn-outline:hover{background:#f8fafc}.btn-block{width:100%}.btn-glass{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);color:#fff}.pill{display:inline-flex;padding:7px 12px;border-radius:999px;background:rgba(41,210,255,.1);border:1px solid rgba(125,224,255,.2);color:#c8f4ff;font-size:12px;font-weight:800}.alert{padding:13px 15px;border-radius:13px;font-size:13px;font-weight:800;line-height:1.7}.alert-error{color:#a71919;background:#fff1f1;border:1px solid #ffcaca}.alert-success{color:#08724f;background:#edfff7;border:1px solid #b8efd8}.flash-alert{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.flash-alert button{border:0;background:transparent;font-size:22px;cursor:pointer;color:inherit}.stack-form{display:grid;gap:17px}.stack-form label,.form-row label,.search-grid label,.form-panel>label{display:grid;gap:8px;font-size:13px;font-weight:800;color:#3d4c62}.stack-form input,.form-row input,.search-grid input,.search-grid select,.form-panel textarea{width:100%;min-height:47px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:10px 13px;color:var(--text);outline:0}.stack-form input:focus,.form-row input:focus,.search-grid input:focus,.search-grid select:focus,.form-panel textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 4px rgba(22,185,233,.1)}em{font-style:normal;color:#dc2626}.login-body,.setup-body{min-height:100vh;background:var(--bg)}.login-layout{display:grid;min-height:100vh;grid-template-columns:1fr 1.05fr}.login-panel{display:grid;place-items:center;padding:36px}.login-box{width:min(100%,440px)}.login-box h1{font-size:34px;margin:46px 0 7px;color:var(--navy);letter-spacing:-1px}.login-box form{margin-top:28px}.login-visual{position:relative;overflow:hidden;background:var(--navy);color:#fff;padding:70px;display:flex;flex-direction:column;justify-content:space-between}.login-visual:before{content:"";position:absolute;width:420px;height:420px;left:-120px;top:-150px;background:#16b9e922;border-radius:50%;filter:blur(18px)}.login-visual>div{position:relative}.login-visual h2{max-width:650px;font-size:42px;line-height:1.55;margin:30px 0 10px}.login-visual p{max-width:590px;color:#bac8da;line-height:2}.feature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.feature-row span{padding:21px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);border-radius:18px;font-size:14px;font-weight:800}.setup-body{display:grid;place-items:center;padding:25px}.setup-card{width:min(100%,520px);background:#fff;border:1px solid var(--line);border-radius:26px;padding:36px;box-shadow:0 24px 60px rgba(12,36,67,.09)}.setup-card h1{margin:24px 0 8px;color:var(--navy);font-size:28px}.setup-card>p{color:var(--muted);line-height:1.9;margin-bottom:24px}.setup-icon{display:grid;place-items:center;width:64px;height:64px;margin-top:30px;border-radius:19px;background:#eafaff;color:#087b9d;font-size:28px}.success-icon{background:#eafbf4;color:var(--success)}.setup-card .alert{margin-bottom:20px}.app-body{min-height:100vh;background:var(--bg)}.sidebar{position:fixed;z-index:50;right:0;top:0;bottom:0;width:278px;background:var(--navy);color:#fff;display:flex;flex-direction:column}.sidebar-brand{height:96px;padding:0 25px;display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(255,255,255,.1)}.sidebar-brand>span:nth-child(2){display:flex;flex:1;flex-direction:column}.sidebar-brand b{font-size:18px}.sidebar-brand small{color:#a9c8df}.sidebar-close{display:none}.sidebar nav{flex:1;padding:27px 16px;overflow-y:auto}.sidebar nav a{display:flex;align-items:center;gap:13px;padding:13px 15px;border-radius:12px;color:#bfccda;font-size:14px;font-weight:800;margin-bottom:6px}.sidebar nav a span{width:20px;text-align:center;font-size:19px;color:#8fa2b8}.sidebar nav a:hover{color:#fff;background:rgba(255,255,255,.06)}.sidebar nav a.active{background:#fff;color:var(--navy);box-shadow:0 8px 22px rgba(0,0,0,.08)}.sidebar nav a.active span{color:#049dc8}.nav-separator{height:1px;background:rgba(255,255,255,.1);margin:23px 0}.nav-label{display:block;color:#778da5;margin:0 15px 10px;font-weight:800}.user-card{display:flex;align-items:center;gap:11px;margin:16px;padding:13px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);border-radius:16px}.avatar{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#42d5f7;color:var(--navy);font-weight:900}.user-card>div:nth-child(2){display:flex;flex:1;min-width:0;flex-direction:column}.user-card b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.user-card small{color:#8fa2b8;margin-top:4px}.logout-btn{border:0;background:transparent;color:#9fb2c5;font-size:22px;cursor:pointer}.main-area{margin-right:278px;min-height:100vh}.topbar{position:sticky;z-index:30;top:0;height:80px;padding:0 38px;background:rgba(255,255,255,.93);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.top-title{display:flex;align-items:center;gap:12px}.top-title small{color:var(--muted);font-size:11px}.top-title h1{color:var(--navy);font-size:20px;margin:5px 0 0}.icon-btn{width:36px;height:36px;border:0;border-radius:10px;display:grid;place-items:center;background:transparent;cursor:pointer}.menu-btn{display:none;border:1px solid var(--line);background:#fff}.mobile-backdrop{display:none}.content{width:min(100%,1500px);margin:auto;padding:38px}.hero-card{position:relative;overflow:hidden;border-radius:28px;background:var(--navy);color:#fff;padding:34px;box-shadow:0 28px 65px -35px rgba(6,24,49,.85)}.hero-card:after{content:"";position:absolute;left:-65px;bottom:-100px;width:300px;height:300px;border:1px solid rgba(58,206,242,.18);border-radius:50%}.hero-card h2{max-width:760px;font-size:29px;line-height:1.55;margin:15px 0 3px}.hero-card p{max-width:650px;color:#bac8da;line-height:1.9;font-size:14px}.hero-card .btn{position:absolute;left:34px;bottom:34px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:26px 0}.stats-grid article{position:relative;background:#fff;border:1px solid var(--line);border-radius:21px;padding:21px;box-shadow:0 9px 25px rgba(19,47,77,.03)}.stats-grid article small{display:block;color:var(--muted);font-weight:800;padding-left:45px}.stats-grid strong{display:block;color:var(--navy);font-size:30px;margin-top:13px}.stats-grid p{color:#9aa8b8;font-size:11px;margin:13px 0 0}.stat-icon{position:absolute;left:18px;top:18px;display:grid;place-items:center;width:43px;height:43px;border-radius:14px;font-size:20px;font-weight:900}.stat-icon.blue{background:#ecf3ff;color:#2563eb}.stat-icon.cyan{background:#e7fbff;color:#0799bc}.stat-icon.violet{background:#f2edff;color:#7c3aed}.stat-icon.amber{background:#fff7e6;color:#d97706}.panel,.table-card{background:#fff;border:1px solid var(--line);border-radius:23px;box-shadow:0 8px 24px rgba(18,48,80,.035)}.panel{padding:26px}.panel-heading h2,.table-heading h2{font-size:18px;color:var(--navy);margin:0}.panel-heading p,.table-heading p{font-size:13px;color:var(--muted);margin:7px 0 0}.table-card{overflow:hidden}.table-heading{padding:23px 25px;border-bottom:1px solid #edf1f6}.table-scroll{overflow:auto}.table-card table{width:100%;min-width:920px;border-collapse:collapse;text-align:right;font-size:13px}.table-card thead{background:#f8fafc;color:var(--muted);font-size:11px}.table-card th,.table-card td{padding:16px 20px;border-bottom:1px solid #eef2f6}.table-card tbody tr:hover{background:#f5fbff}.table-card td small{display:block;color:#9aa8b8;font-size:10px;margin-top:5px}.subject-cell{max-width:330px;font-weight:700;line-height:1.7}.serial{display:inline-flex;padding:6px 9px;border-radius:8px;background:#eef2f6;color:var(--navy-2);font-family:Consolas,monospace;font-weight:900}.badge{display:inline-flex;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:900}.badge-cyan{background:#e7fbff;color:#087d99}.badge-blue{background:#edf3ff;color:#245fc0}.badge-green{background:#eafaf3;color:#087553}.badge-gray{background:#f0f3f6;color:#576678}.row-actions{display:flex;gap:5px}.view-btn{color:#1769b8;background:#edf6ff}.delete-btn{color:#dc2626;background:#fff0f0}.empty-state{text-align:center!important;color:var(--muted);padding:48px!important}.entry-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:22px}.form-panel{display:grid;gap:23px}.field>label{display:block;font-size:13px;font-weight:800;color:#3d4c62;margin-bottom:9px}.direction-picker{display:grid;grid-template-columns:1fr 1fr;gap:12px}.direction-picker input{position:absolute;opacity:0}.direction-picker span{display:flex;align-items:center;justify-content:center;height:54px;border:2px solid var(--line);border-radius:13px;font-weight:900;cursor:pointer}.direction-picker input:checked+span{border-color:var(--cyan);background:#eefdff;color:#087a9b}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:17px}.readonly-field,.serial-hint{display:flex;align-items:center;height:47px;border:1px solid var(--line);border-radius:12px;background:#f8fafc;padding:0 13px;color:#607089}.serial-hint{border-style:dashed;border-color:#9adff0;background:#effcff;color:#087b99}.form-actions{display:flex;gap:11px;padding-top:20px;border-top:1px solid #edf1f6}.upload-panel{height:max-content}.upload-preview{min-height:265px;margin:22px 0 13px;border:2px dashed #dbe4ee;border-radius:18px;background:#f8fafc;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:16px;overflow:hidden}.file-placeholder{font-size:48px;color:#90a4b9}.upload-preview b{font-size:13px;color:#536379;margin-top:12px;max-width:100%;overflow:hidden;text-overflow:ellipsis}.upload-preview small{font-size:10px;color:#9aa8b8;margin-top:8px;line-height:1.7}.upload-preview img{display:none;max-width:100%;max-height:310px;border-radius:12px;object-fit:contain}.upload-preview.has-image .file-placeholder,.upload-preview.has-image b,.upload-preview.has-image small{display:none}.upload-preview.has-image img{display:block}.upload-button{margin-top:11px;cursor:pointer}.upload-button input{position:absolute;width:1px;height:1px;opacity:0}.upload-note{text-align:center;color:#8b9aab;font-size:10px;line-height:1.7}.heading-row{display:flex;align-items:center;justify-content:space-between}.heading-row a{font-size:12px;color:var(--muted);font-weight:800}.search-panel{margin-bottom:22px}.search-grid{display:grid;grid-template-columns:repeat(4,1fr) auto;gap:15px;align-items:end;margin-top:21px}.users-grid{display:grid;grid-template-columns:350px minmax(0,1fr);gap:22px}.users-table td:first-child{font-weight:800}
@media(max-width:1150px){.stats-grid{grid-template-columns:repeat(2,1fr)}.entry-grid{grid-template-columns:1fr}.upload-panel{order:-1}.upload-preview{min-height:220px}.search-grid{grid-template-columns:repeat(2,1fr)}.search-grid .btn{align-self:end}.users-grid{grid-template-columns:1fr}.login-visual{padding:50px}.login-visual h2{font-size:34px}}
@media(max-width:900px){.sidebar{transform:translateX(100%);transition:transform .25s}.sidebar.open{transform:translateX(0)}.sidebar-close{display:grid;color:#fff}.mobile-backdrop{position:fixed;z-index:45;inset:0;border:0;background:rgba(3,15,30,.48)}.mobile-backdrop.open{display:block}.main-area{margin-right:0}.menu-btn{display:grid}.topbar{padding:0 18px}.content{padding:22px}.login-layout{grid-template-columns:1fr}.login-visual{display:none}}
@media(max-width:640px){.topbar{height:72px}.topbar>.btn{font-size:0;width:44px;padding:0}.topbar>.btn:first-letter{font-size:20px}.top-title h1{font-size:17px}.top-title small{display:none}.content{padding:15px}.hero-card{padding:25px}.hero-card h2{font-size:22px}.hero-card .btn{position:static;margin-top:12px}.stats-grid{grid-template-columns:1fr 1fr;gap:10px}.stats-grid article{padding:17px}.stats-grid strong{font-size:25px}.stat-icon{width:36px;height:36px}.form-row,.search-grid{grid-template-columns:1fr}.form-actions{flex-direction:column}.form-actions .btn{width:100%}.panel{padding:19px}.heading-row{align-items:flex-start;gap:14px}.setup-card{padding:25px}.login-panel{padding:23px}.login-box h1{font-size:29px}.feature-row{grid-template-columns:1fr}.stats-grid article small{padding-left:34px;font-size:11px}.table-heading{padding:19px}.direction-picker{gap:8px}}

.stats-grid-six{grid-template-columns:repeat(3,1fr)}
.record-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}.record-tabs a{display:flex;align-items:center;justify-content:center;gap:9px;min-height:55px;padding:10px 14px;border:1px solid var(--line);border-radius:15px;background:#fff;color:var(--navy-2);font-weight:900}.record-tabs a span{font-size:18px}.record-tabs a:hover,.record-tabs a.active{border-color:var(--cyan);background:#eefdff;color:#087a9b;box-shadow:0 8px 22px rgba(22,185,233,.08)}
.search-grid-wide{grid-template-columns:repeat(4,1fr)}.search-grid-wide .btn{min-height:47px}
@media(max-width:1150px){.stats-grid-six{grid-template-columns:repeat(2,1fr)}.record-tabs{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.record-tabs{grid-template-columns:1fr 1fr}.record-tabs a{font-size:12px}.search-grid-wide{grid-template-columns:1fr}}