:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#f8fafc;background:#07111f;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 10% 0,#173154 0,#0b1728 34%,#060d18 100%)}button,input,select,textarea{font:inherit}.shell{width:min(760px,100%);margin:auto;padding:22px 18px 42px}.top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:22px}.brand{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:#93a4bc}.who{font-size:13px;color:#9fb0c8}.title{font-size:clamp(25px,6vw,42px);line-height:1.04;margin:0 0 8px}.sub{color:#9fb0c8;margin:0 0 24px}.card{background:rgba(17,31,51,.92);border:1px solid #263b59;border-radius:24px;padding:20px;box-shadow:0 22px 70px #0007}.login{max-width:430px;margin:10vh auto 0}.pin{width:100%;padding:18px;text-align:center;letter-spacing:.45em;font-size:28px;border-radius:15px;border:1px solid #37506f;background:#07111f;color:#fff;outline:none}.pin:focus,.field:focus{border-color:#53d6a3;box-shadow:0 0 0 3px #53d6a326}.primary,.secondary,.danger{border:0;border-radius:15px;padding:16px 18px;font-weight:750;cursor:pointer}.primary{background:#48d59c;color:#062218}.secondary{background:#1e3049;color:#e8eef7}.danger{background:#5f2732;color:#ffd9de}.full{width:100%;margin-top:14px}.hint{font-size:13px;color:#8395ae;margin-top:14px}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.tile{min-height:142px;border:1px solid #29415f;border-radius:20px;padding:18px;background:linear-gradient(145deg,#172a43,#101e31);color:#fff;text-align:left;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between}.tile strong{font-size:20px}.tile span{font-size:13px;color:#9fb0c8}.tile.accent{background:linear-gradient(145deg,#55dfa9,#2aaf7f);color:#05251a;border:0}.tile.accent span{color:#0c503c}.badge{display:inline-flex;padding:5px 9px;border-radius:999px;background:#243a56;color:#b8c7d9;font-size:12px}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.label{display:block;color:#9fb0c8;font-size:13px;margin:0 0 7px}.field{width:100%;border:1px solid #304764;border-radius:13px;background:#0a1524;color:#fff;padding:14px;outline:none}.span2{grid-column:1/-1}.transfer{display:grid;grid-template-columns:1fr 140px 44px;gap:8px;margin:8px 0}.iconbtn{border:0;border-radius:12px;background:#482633;color:#ffd5dc;font-size:22px}.sum{display:flex;justify-content:space-between;align-items:end;margin:18px 0;padding-top:16px;border-top:1px solid #2a3f5b}.sum strong{font-size:28px}.actions{display:flex;gap:10px;flex-wrap:wrap}.actions>*{flex:1}.report{border:1px solid #2a405e;border-radius:16px;padding:14px;margin:10px 0;background:#0b1727}.reporttop{display:flex;justify-content:space-between;gap:10px}.report p{margin:5px 0;color:#9fb0c8;font-size:13px}.status-draft{color:#f5c96a}.status-queued{color:#f5c96a}.status-exported{color:#68b8ff}.status-accepted{color:#58d49f}.empty{text-align:center;color:#8295ae;padding:36px 10px}.toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,120px);background:#f8fafc;color:#0b1524;padding:12px 16px;border-radius:12px;box-shadow:0 10px 35px #0009;transition:.25s;z-index:5}.toast.show{transform:translate(-50%,0)}@media(max-width:560px){.grid,.formgrid{grid-template-columns:1fr}.span2{grid-column:auto}.tile{min-height:118px}.transfer{grid-template-columns:1fr 110px 42px}.shell{padding:16px 12px 32px}.card{padding:16px;border-radius:20px}}
/* Terminal-style home tile layout */
.home-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.home-grid .tile-wide{grid-column:1/-1;min-height:150px}
.home-grid .tile-logout{background:linear-gradient(145deg,#162338,#0d1828)}
@media(max-width:560px){.home-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.home-grid .tile{min-height:132px;padding:16px;border-radius:18px}.home-grid .tile-wide{grid-column:1/-1;min-height:140px}.home-grid .tile strong{font-size:18px;line-height:1.08}.home-grid .tile span{font-size:12px;line-height:1.3}}
@media(max-width:360px){.home-grid{grid-template-columns:1fr}.home-grid .tile-wide{grid-column:auto}}
.formgrid>*{min-width:0}.date-button,.date-picker{display:block;width:100%;min-width:0;max-width:100%;min-height:52px}.date-button{text-align:left;color:#e8eef7}.date-picker[hidden]{display:none}
.date-overlay{position:fixed;inset:0;z-index:20;display:flex;align-items:flex-end;justify-content:center;padding:16px;background:#020711bf;backdrop-filter:blur(8px)}.date-sheet{width:min(560px,100%);padding:22px;border:1px solid #304764;border-radius:26px;background:#111f33;box-shadow:0 24px 80px #000b}.date-sheet h2{margin:0 0 6px;font-size:24px}.date-sheet>p{margin:0 0 20px;color:#9fb0c8}.date-selects{display:grid;grid-template-columns:.75fr 1.5fr 1fr;gap:10px;margin-bottom:20px}.date-selects label{min-width:0}.date-selects span{display:block;margin:0 0 7px;color:#9fb0c8;font-size:12px}.date-selects .field{padding:14px 10px}@media(max-width:390px){.date-overlay{padding:10px}.date-sheet{padding:18px 14px}.date-selects{grid-template-columns:.7fr 1.45fr .9fr;gap:7px}.date-selects .field{padding:13px 7px;font-size:14px}}
.quick-transfer{margin-top:10px;padding:14px;border:1px solid #304764;border-radius:16px;background:#0b1727}.quick-transfer[hidden]{display:none}.quick-transfer label{display:block;margin-bottom:12px}.quick-transfer .actions{margin-top:4px}
.salary-box{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 12px;margin:-4px 0 18px;padding:16px;border:1px solid #2f6b59;border-radius:16px;background:#0d2a23}.salary-box span{color:#a9c9be}.salary-box strong{font-size:26px;color:#55dfa9}.salary-box small{flex-basis:100%;color:#7fa99b}
.preview-rows{display:grid;gap:0;margin:12px 0 18px;border:1px solid #2a405e;border-radius:16px;overflow:hidden}.preview-rows>div{display:flex;justify-content:space-between;gap:16px;padding:11px 14px;border-bottom:1px solid #263b59}.preview-rows>div:last-child{border-bottom:0}.preview-rows span{color:#9fb0c8}.preview-rows .preview-total{background:#142b3f}.preview-rows .preview-cash{background:#0d362b}.preview-total strong{color:#d8e8ff}.preview-cash strong{color:#55dfa9;font-size:20px}