:root{color:#162039;background:#f4f6fa;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}.app{grid-template-columns:260px 1fr;min-height:100vh;display:grid}aside{color:#fff;background:#10182c;flex-direction:column;height:100vh;padding:28px 18px;display:flex;position:sticky;top:0}.brand{align-items:center;gap:12px;padding:0 10px 28px;display:flex}.brand>span{color:#f4d88a;border:1px solid #d9ad58;border-radius:50%;place-items:center;width:44px;height:44px;display:grid}.brand small{letter-spacing:3px;color:#c9cbd3;font-size:9px;display:block}.brand b{color:#f4d88a;letter-spacing:1px;margin-top:3px;display:block}nav{gap:6px;display:grid}nav button,.logout{color:#c9cbd3;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:10px;align-items:center;gap:10px;padding:12px;display:flex}nav button:hover,nav button.active{color:#f4d88a;background:#ffffff12}.logout{margin-top:auto}main{min-width:0;padding:36px}header{justify-content:space-between;align-items:center;margin-bottom:28px;display:flex}header small{letter-spacing:2px;color:#b98224;font-size:10px;font-weight:700}h1,h2,h3,p{margin-top:0}header h1{margin:5px 0 0}.icon{background:#fff;border:1px solid #dde1e9;border-radius:10px;padding:10px}.stats{grid-template-columns:repeat(5,minmax(150px,1fr));gap:14px;margin-bottom:22px;display:grid}.stat,.panel{background:#fff;border:1px solid #e1e4eb;border-radius:18px;box-shadow:0 8px 30px #10182c0b}.stat{padding:22px}.stat small{color:#747d90;display:block}.stat strong{margin-top:10px;font-size:25px;display:block}.panel{margin-bottom:22px;padding:24px}.panel-head{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.panel-head h2{margin:0;font-size:19px}button{color:#10182c;cursor:pointer;background:#d9ad58;border:0;border-radius:9px;padding:10px 16px;font-weight:700}.secondary{background:#eef0f5}.danger{color:#b91c1c;background:#fee2e2}.error{color:#b91c1c;background:#fef2f2;border:1px solid #fecaca;border-radius:10px;margin-bottom:15px;padding:12px}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:13px}th,td{text-align:left;white-space:pre-line;border-bottom:1px solid #eceef2;padding:13px}th{letter-spacing:1px;color:#737b8b;font-size:10px}.cards{gap:12px;display:grid}.user,.review{border:1px solid #e3e6ec;border-radius:14px;padding:17px}.user{grid-template-columns:1fr 1.2fr;gap:20px;display:grid}.user p,.review p{color:#5e6778;margin:6px 0}.user small,.review small,.muted{color:#838b99}.pill{background:#eef0f5;border-radius:999px;margin:3px;padding:5px 8px;font-size:11px;display:inline-block}.pill.active,.pill.approved{color:#166534;background:#dcfce7}.pill.pending{color:#92400e;background:#fef3c7}.pill.cancelled,.pill.rejected{color:#991b1b;background:#fee2e2}.review>div:first-child{justify-content:space-between;display:flex}.review footer{gap:8px;margin-top:14px;display:flex}.review-form{background:#f7f8fb;border-radius:14px;grid-template-columns:1fr 1fr 120px 140px;gap:10px;margin-bottom:18px;padding:18px;display:grid}.review-form input,.review-form select,.review-form textarea,.login input{background:#fff;border:1px solid #dce0e8;border-radius:9px;padding:11px}.review-form textarea{grid-column:1/-1;min-height:100px}.review-form div{grid-column:1/-1;gap:8px;display:flex}.login{background:radial-gradient(circle at top,#24345b,#10182c 65%);place-items:center;min-height:100vh;padding:20px;display:grid}.login form{background:#fff;border-radius:22px;width:min(430px,100%);padding:34px}.login .brand{background:#10182c;border-radius:22px 22px 0 0;margin:-34px -34px 30px;padding:22px 28px}.login form>p{color:#687184}.login label{gap:7px;margin:16px 0;font-size:13px;font-weight:600;display:grid}.login button{width:100%;margin-top:8px}.empty{text-align:center;color:#838b99;padding:24px}@media (width<=1000px){.app{grid-template-columns:1fr}aside{height:auto;position:static}aside nav{grid-template-columns:repeat(4,1fr)}.logout{margin-top:12px}.stats{grid-template-columns:repeat(2,1fr)}.user{grid-template-columns:1fr}.review-form{grid-template-columns:1fr 1fr}}@media (width<=620px){main{padding:20px}aside nav{grid-template-columns:1fr 1fr}.stats,.review-form{grid-template-columns:1fr}.review-form>*{grid-column:1!important}}.empty-state{text-align:center;color:#737b8b;border:1px dashed #cfd4de;border-radius:14px;padding:34px}.empty-state p{margin:8px 0 0}.notice{color:#166534;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:10px;margin-bottom:15px;padding:12px}.user-table td{vertical-align:top;min-width:130px}.user-table td:first-child{min-width:220px}.user-table td:last-child{min-width:330px}.member-row{border-bottom:1px solid #eceef2;gap:7px;margin:0 0 12px;padding:0 0 12px;display:grid}.member-row:last-child{margin-bottom:0}.member-meta{flex-wrap:wrap;align-items:center;gap:5px;display:flex}.expiry-form,.assign-form{flex-wrap:wrap;align-items:center;gap:7px;display:flex}.expiry-form input,.assign-form input,.assign-form select{background:#fff;border:1px solid #dce0e8;border-radius:8px;max-width:170px;padding:8px}.expiry-form button,.assign-form button{padding:8px 11px}.assign-form{background:#f7f8fb;border-radius:10px;padding:13px}.assign-form strong{width:100%;font-size:12px}.cell-subtle{color:#838b99;margin-top:4px;display:block}.role-cell{text-transform:capitalize}.modal-backdrop{z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#10182cb8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.modal-card{background:#fff;border-radius:20px;width:min(500px,100%);max-height:90vh;padding:30px;position:relative;overflow:auto;box-shadow:0 28px 80px #080d1c66}.modal-card>small{color:#b98224;letter-spacing:2px;font-size:10px;font-weight:700}.modal-card h2{margin:7px 38px 5px 0}.modal-card>p{color:#687184}.modal-close{background:#eef0f5;border-radius:50%;width:36px;height:36px;padding:0;font-size:25px;font-weight:400;position:absolute;top:16px;right:18px}.membership-modal-form{gap:16px;margin-top:22px;display:grid}.membership-modal-form label{gap:7px;font-size:13px;font-weight:700;display:grid}.membership-modal-form input,.membership-modal-form select{background:#fff;border:1px solid #dce0e8;border-radius:9px;width:100%;padding:11px}.current-plan{background:#f7f8fb;border-radius:10px;gap:5px;padding:14px;display:grid}.current-plan span,.current-plan small{color:#737b8b;font-size:12px}.modal-actions{justify-content:flex-end;gap:9px;margin-top:5px;display:flex}.panel:has(.user-table){background:linear-gradient(#fff 0%,#fafbfe 100%);border-color:#e4e7ee;box-shadow:0 18px 50px #10182c12}.panel:has(.user-table) .panel-head{border-bottom:1px solid #edf0f5;padding-bottom:17px}.panel:has(.user-table) .panel-head h2{align-items:center;gap:10px;font-size:21px;display:flex}.panel:has(.user-table) .panel-head h2:before{content:"";background:#d9ad58;border-radius:50%;width:9px;height:9px;box-shadow:0 0 0 6px #d9ad5824}.user-table{border-collapse:separate;border-spacing:0 12px}.user-table thead th{color:#9299a7;border:0;padding:0 18px 5px}.user-table tbody tr{filter:drop-shadow(0 5px 12px #10182c0a);background:linear-gradient(135deg,#fff,#fbfcff);transition:filter .2s,transform .2s}.user-table tbody tr:hover{filter:drop-shadow(0 10px 22px #10182c1a);transform:translateY(-1px)}.user-table tbody td{border-top:1px solid #e7e9ef;border-bottom:1px solid #e7e9ef;padding:19px 18px}.user-table tbody td:first-child{border-left:1px solid #e7e9ef;border-radius:14px 0 0 14px;padding-left:76px;position:relative}.user-table tbody td:first-child:before{content:"✦";color:#f4d88a;background:linear-gradient(145deg,#1b2948,#10182c);border:1px solid #d9ad5852;border-radius:13px;place-items:center;width:42px;height:42px;font-size:17px;display:grid;position:absolute;top:50%;left:18px;translate:0 -50%;box-shadow:inset 0 0 0 3px #ffffff08}.user-table tbody td:last-child{border-right:1px solid #e7e9ef;border-radius:0 14px 14px 0}.user-table tbody td:first-child>b{color:#172039;font-size:14px}.cell-subtle{line-height:1.45}.role-cell .pill{text-transform:capitalize;font-weight:700}.role-cell .pill:first-child{color:#3c4b68;background:#edf1f8}.member-row{background:#fff;border:1px solid #e6e8ed;border-radius:11px;grid-template-columns:1fr auto;align-items:center;margin-bottom:9px;padding:12px 13px}.member-row:last-of-type{margin-bottom:11px}.member-row .member-meta b{color:#172039}.member-row .member-meta small{color:#798193;width:100%;line-height:1.5}.member-row .secondary{border:1px solid #e0e4eb;padding:7px 10px;font-size:11px;transition:background .2s}.member-row .secondary:hover{background:#e3e7ef}.user-table td>button{padding:9px 13px;font-size:12px;transition:transform .2s,box-shadow .2s;box-shadow:0 5px 12px #d9ad5833}.user-table td>button:hover{transform:translateY(-1px);box-shadow:0 7px 16px #d9ad584d}@media (width<=800px){.panel:has(.user-table){padding:17px}.user-table thead{display:none}.user-table,.user-table tbody,.user-table tr,.user-table td{width:100%;display:block}.user-table tbody tr{border:1px solid #e7e9ef;border-radius:16px;margin-bottom:16px;overflow:hidden}.user-table tbody td,.user-table tbody td:first-child,.user-table tbody td:last-child{border:0;border-bottom:1px solid #eef0f4;border-radius:0;min-width:0}.user-table tbody td:first-child{min-height:78px;padding-left:76px}.user-table tbody td:last-child{border-bottom:0}.member-row{grid-template-columns:1fr}.member-row .secondary{justify-self:start}}
