:root{
  --navy:#06234a;--navy2:#0b3a73;--navy3:#123f72;--red:#a71930;--red2:#c62c45;
  --gold:#d6a72c;--gold2:#f3ce5a;--ink:#17243a;--muted:#68788c;--line:#e4eaf2;
  --bg:#f4f7fb;--surface:#fff;--soft:#f8fafc;--green:#08775d;--blue:#1a65a8;
  --shadow:0 18px 50px rgba(8,38,75,.09);--shadow-lg:0 28px 80px rgba(5,28,59,.16);
  --radius:24px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.6 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif}a{color:inherit}
.hero{position:relative;color:#fff;overflow:hidden;background:radial-gradient(circle at 88% 12%,#1c548e55 0 13%,transparent 31%),linear-gradient(120deg,#031328 0%,#062b5b 54%,#7d1b2e 140%);isolation:isolate}.hero:before{content:"";position:absolute;width:520px;height:520px;right:-210px;top:-260px;border:1px solid #fff2;border-radius:50%;box-shadow:0 0 0 65px #fff1,0 0 0 130px #fff08;z-index:-1}.hero:after{content:"";position:absolute;left:-12%;right:-12%;bottom:-175px;height:300px;background:radial-gradient(ellipse at center,#fff2,transparent 68%);z-index:-1}
.hero-inner,.main{width:min(1180px,calc(100% - 36px));margin:auto;position:relative;z-index:1}.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:17px 0;border-bottom:1px solid #ffffff1c}.brand{display:flex;align-items:center;gap:14px;min-width:0}.brand-logos{display:flex;align-items:center;gap:7px;flex:none}.brand-logos img{width:48px;height:54px;object-fit:contain;filter:drop-shadow(0 6px 14px #0005)}.brand-title{font-weight:850;letter-spacing:.3px;line-height:1.25;font-size:14px}.brand-title small{display:block;font-size:10px;color:#dbe7f6;font-weight:500;margin-top:3px;letter-spacing:.2px}.nav-actions{display:flex;gap:8px;align-items:center}.nav-link{padding:9px 11px;border-radius:10px;color:#e8f0fa;text-decoration:none;font-size:12px;font-weight:750}.nav-link:hover{background:#fff1}
.hero-copy{display:grid;grid-template-columns:1.06fr .94fr;gap:52px;align-items:center;padding:72px 0 112px}.eyebrow{color:var(--gold2);font-size:11px;font-weight:900;letter-spacing:2px;text-transform:uppercase}.hero h1{font-size:clamp(42px,5.5vw,67px);line-height:1.01;margin:13px 0 20px;letter-spacing:-2.5px;max-width:760px}.hero p{max-width:680px;color:#d9e6f4;font-size:17px;line-height:1.78;margin:0}.hero-art{position:relative;min-height:350px;border-radius:32px;background:linear-gradient(145deg,#ffffff12,#ffffff05);border:1px solid #ffffff24;box-shadow:inset 0 1px #fff2,0 30px 90px #0003;display:flex;align-items:center;justify-content:center;overflow:hidden}.hero-art:before{content:"";position:absolute;inset:16px;border:1px solid #ffffff13;border-radius:24px;pointer-events:none}.hero-art img{width:100%;height:100%;max-height:360px;object-fit:cover;display:block}.hero-badge{position:absolute;left:18px;bottom:18px;display:flex;align-items:center;gap:10px;padding:10px 13px;border:1px solid #fff2;border-radius:14px;background:#061a36c9;backdrop-filter:blur(12px);font-size:11px;font-weight:800}.hero-badge span{width:8px;height:8px;border-radius:50%;background:#45d2a3;box-shadow:0 0 0 5px #45d2a31b}
.hero-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:30px;max-width:690px}.hero-metric{padding:13px 14px;border:1px solid #ffffff1b;border-radius:15px;background:#ffffff0b;backdrop-filter:blur(8px)}.hero-metric strong{display:block;font-size:17px}.hero-metric span{display:block;color:#b9cbe0;font-size:11px;margin-top:2px}
.main{margin-top:-55px;padding-bottom:72px}.notice{padding:15px 18px;border-radius:15px;background:#e9f8f2;color:#08624c;border:1px solid #c7eadc;box-shadow:0 8px 24px #06234a0c;margin-bottom:20px}.notice.error{background:#ffedf0;color:#9a2637;border-color:#f4cbd3}.panel{background:var(--surface);border:1px solid #e7edf4;border-radius:var(--radius);padding:31px;box-shadow:var(--shadow);margin-bottom:24px}.panel.compact{padding:22px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin:2px 0 22px}.section-heading h2{margin:5px 0 0;font-size:30px;letter-spacing:-.8px;line-height:1.15}.section-heading p{margin:0;color:var(--muted);max-width:550px}.kicker{font-size:10px;letter-spacing:2px;color:var(--red);font-weight:950}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.field{margin:0 0 15px}.field label{display:block;font-size:12px;font-weight:850;margin-bottom:7px}.field input,.field select,.field textarea,input,select,textarea{font:inherit;width:100%;padding:12px 13px;border:1px solid #cdd9e7;border-radius:12px;background:#fff;color:var(--ink);outline:none;transition:.18s}.field input:hover,.field select:hover,.field textarea:hover{border-color:#aebfd2}.field input:focus,.field select:focus,.field textarea:focus{border-color:#4c79a7;box-shadow:0 0 0 4px #0b397014}.field textarea{min-height:115px;resize:vertical}.help{font-size:12px;color:var(--muted);margin-top:5px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:12px;padding:12px 17px;background:var(--navy);color:#fff;font-weight:850;text-decoration:none;cursor:pointer;transition:.18s;box-shadow:0 6px 16px #06234a10}.btn:hover{transform:translateY(-1px);box-shadow:0 11px 24px #06234a1b}.btn.gold{background:linear-gradient(135deg,var(--gold2),var(--gold));color:#18263b}.btn.red{background:var(--red)}.btn.light{background:#fff;color:var(--navy);border-color:#d6e0ea}.btn.small{padding:8px 11px;font-size:12px;border-radius:10px}.btn.block{width:100%}
.auth-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:30px}.auth-card{padding:8px 5px}.auth-title{font-size:34px;letter-spacing:-1px;margin:7px 0 10px}.feature-list{display:grid;gap:11px;margin:23px 0 0}.feature{display:flex;gap:12px;padding:15px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(180deg,#fff,#f9fbfd)}.feature-icon{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:#edf3f9;color:var(--navy);font-weight:900;flex:none}.feature b{display:block}.feature span{color:var(--muted);font-size:12px}.demo-box{margin-top:17px;padding:15px;border:1px solid #ead9a6;border-radius:16px;background:linear-gradient(135deg,#fffaf0,#fffdf8)}.demo-box .demo-title{display:flex;justify-content:space-between;gap:10px;align-items:center}.demo-chip{padding:5px 8px;border-radius:999px;background:#f8e6a7;color:#725300;font-size:9px;font-weight:950;letter-spacing:.8px}.demo-credentials{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:11px}.credential{padding:10px 11px;border:1px solid #eadfbd;border-radius:11px;background:#fff}.credential small{display:block;color:#8b7a4d;font-size:10px}.credential code{font:700 11px ui-monospace,SFMono-Regular,Menlo,monospace;color:#493a12;word-break:break-all}
.news-section{margin-bottom:25px}.news-grid{display:grid;grid-template-columns:1.25fr .875fr .875fr;gap:18px}.news-card{background:#fff;border:1px solid #e7edf4;border-radius:21px;overflow:hidden;box-shadow:0 12px 35px #06234a10;transition:.22s}.news-card:first-child{grid-row:span 2}.news-card:hover{transform:translateY(-3px);box-shadow:0 20px 50px #06234a18}.news-image{height:180px;background:#dfe7ef center/cover no-repeat;position:relative}.news-card:first-child .news-image{height:330px}.news-image:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 25%,#061a3694)}.news-tag{position:absolute;z-index:1;left:14px;bottom:13px;padding:5px 9px;border-radius:999px;background:var(--gold2);font-size:9px;font-weight:950;letter-spacing:.6px}.news-body{padding:18px 19px 20px}.news-body small{color:var(--red);font-weight:850}.news-body h3{font-size:18px;line-height:1.35;margin:7px 0 9px}.news-body p{margin:0;color:var(--muted);font-size:13px}.news-card:first-child .news-body h3{font-size:23px}
.news-manage{display:grid;gap:12px}.manage-item{border:1px solid var(--line);border-radius:16px;padding:14px;background:#fbfcfe}.manage-item-row{display:flex;gap:12px;justify-content:space-between;align-items:center}.manage-thumb{width:92px;height:62px;border-radius:10px;object-fit:cover;background:#e7edf4}.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:13px;margin-bottom:20px}.stat{position:relative;padding:18px;border-radius:17px;background:linear-gradient(180deg,#fff,#f8fafc);border:1px solid var(--line);overflow:hidden}.stat:after{content:"";position:absolute;width:75px;height:75px;right:-28px;top:-28px;border-radius:50%;background:#0b39700b}.stat small{display:block;color:var(--muted);font-weight:750}.stat b{display:block;font-size:30px;line-height:1;margin-top:7px}.stat.red{border-top:4px solid var(--red)}.stat.gold{border-top:4px solid var(--gold)}.stat.blue{border-top:4px solid var(--blue)}.stat.green{border-top:4px solid var(--green)}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:15px}table{width:100%;border-collapse:collapse;background:#fff}th,td{padding:13px 14px;border-bottom:1px solid #edf1f5;text-align:left;white-space:nowrap}th{background:#f7f9fc;font-size:10px;text-transform:uppercase;letter-spacing:.7px;color:#647286}tr:last-child td{border-bottom:0}tbody tr:hover{background:#fbfcfe}.status{display:inline-flex;padding:6px 9px;border-radius:999px;font-size:10px;font-weight:950;letter-spacing:.3px}.status.pending{background:#fff4cf;color:#8b6500}.status.review{background:#e8f1ff;color:#15568f}.status.approved{background:#e6f7ef;color:#08775d}.status.rejected{background:#ffeaed;color:#a31e32}.status.resubmit{background:#fff0dc;color:#985900}.status.completed{background:#e9e9ef;color:#41475b}.card{border:1px solid var(--line);border-radius:17px;padding:18px;background:#fff}.history{display:grid;gap:14px}.approval{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;margin-top:18px;padding:20px;border-radius:18px;background:linear-gradient(135deg,#edf9f4,#f8fcfa);border:1px solid #cce9dd}.qr-box{background:#fff;border:1px solid #dce4ec;border-radius:16px;padding:14px;text-align:center;min-width:330px}.qr-box canvas{display:block;width:320px;height:320px;max-width:100%;margin:auto;image-rendering:pixelated}.qr-caption{font-size:11px;color:var(--muted);margin-top:8px}.calendar-shell{border:1px solid var(--line);border-radius:18px;padding:16px;background:#fbfcfe}.calendar-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.calendar-head button{width:36px;height:36px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;font-size:18px;color:var(--navy)}.calendar-head button:hover{background:#eef3f8}.calendar-title{font-weight:900}.calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.cal-weekday{text-align:center;font-size:10px;font-weight:900;color:#7a8798;padding:6px 0}.day{min-height:42px;border:1px solid transparent;border-radius:10px;background:#fff;cursor:pointer;font-weight:750}.day:hover:not(.disabled){border-color:#7fa0c3}.day.selected{background:var(--navy);color:#fff}.day.weekend,.day.disabled{color:#c33a4d;background:#fff0f2;cursor:not-allowed}.day.muted{color:#bdc6d1;background:#f6f8fa}.day.today{box-shadow:inset 0 0 0 2px var(--gold)}.slot-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.slot-btn{border:1px solid #d5dfeb;background:#fff;border-radius:12px;padding:12px;cursor:pointer;text-align:left}.slot-btn:hover{border-color:#8ba8c5}.slot-btn strong{display:block}.slot-btn span{font-size:11px;color:var(--muted)}.slot-btn.selected{border-color:var(--navy);box-shadow:0 0 0 3px #0b397014;background:#f1f6fb}.slot-btn.full{opacity:.45;cursor:not-allowed}.upload{padding:18px;border:1px dashed #9fb2c8;border-radius:16px;background:#f8fafc}.notif-list{display:grid;gap:10px}.notif{padding:14px;border-radius:13px;background:#f7f9fc;border:1px solid var(--line)}.notif.unread{background:#eef5ff;border-color:#c8dcf4}.notif small{color:var(--muted)}.empty{padding:30px;text-align:center;color:var(--muted);border:1px dashed #cfd9e5;border-radius:15px}.split{display:grid;grid-template-columns:1fr 1fr;gap:22px}.toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:15px}.inline{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.footer{background:linear-gradient(135deg,#04162e,#082b55);color:#d8e4f3;padding:38px 0}.footer-inner{width:min(1180px,calc(100% - 36px));margin:auto;display:flex;justify-content:space-between;gap:25px}.modal-note{font-size:12px;color:var(--muted)}details>summary{list-style:none}details>summary::-webkit-details-marker{display:none}.danger-note{padding:12px;border-radius:12px;background:#fff1f3;color:#9a2637;font-size:12px}.success-note{padding:12px;border-radius:12px;background:#ecf9f4;color:#08775d;font-size:12px}.dashboard-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 20px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,#f8fafc,#fff);margin-bottom:20px}.role-pill{display:inline-flex;padding:7px 10px;border-radius:999px;background:#edf3f9;color:var(--navy);font-size:10px;font-weight:950;letter-spacing:.6px}.section-divider{height:1px;background:var(--line);margin:26px 0}
@media(max-width:980px){.hero-copy,.auth-grid,.split{grid-template-columns:1fr}.hero-art{min-height:270px}.news-grid{grid-template-columns:1fr 1fr}.news-card:first-child{grid-row:auto}.news-card:first-child .news-image{height:220px}.stats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.hero-inner,.main{width:min(100% - 24px,1180px)}.nav{align-items:flex-start}.nav-actions .nav-link{display:none}.brand-title{font-size:12px}.brand-title small{font-size:9px}.brand-logos img{width:39px;height:46px}.hero-copy{padding:48px 0 90px;gap:28px}.hero h1{font-size:42px;letter-spacing:-1.8px}.hero p{font-size:15px}.hero-metrics{grid-template-columns:1fr}.hero-art{min-height:220px}.panel{padding:21px;border-radius:20px}.grid,.grid-3{grid-template-columns:1fr}.news-grid{grid-template-columns:1fr}.news-card:first-child .news-image{height:210px}.stats{grid-template-columns:1fr 1fr}.approval{grid-template-columns:1fr}.qr-box{min-width:0}.slot-grid{grid-template-columns:1fr 1fr}.section-heading{display:block}.section-heading p{margin-top:8px}.footer-inner{display:block}.demo-credentials{grid-template-columns:1fr}}
@media print{.hero,.footer,.btn,.notice{display:none!important}.main{width:100%;margin:0}.panel{box-shadow:none;border:0}.approval{break-inside:avoid}}