*{box-sizing:border-box}
body{margin:0;font-family:Arial,Tahoma,sans-serif;background:#f1f7f5;color:#20332e}
.container{width:min(94%,1080px);margin:36px auto}
.container.narrow{width:min(94%,540px)}
.card{background:#fff;border:1px solid #dbe8e3;border-radius:18px;padding:26px;box-shadow:0 15px 40px rgba(32,70,58,.10);margin-bottom:20px}
h1,h2,h3{margin-top:0;color:#176b52}
label{display:block;margin:14px 0 7px;font-weight:700}
input,select,textarea{width:100%;padding:12px 14px;border:1px solid #bdd2ca;border-radius:10px;font-size:16px}
button,.button{display:inline-block;padding:12px 16px;border:0;border-radius:10px;background:#238566;color:#fff;font-size:15px;font-weight:700;text-decoration:none;text-align:center;cursor:pointer}
.button.secondary{background:#607d74}
.button.warning{background:#c98216}
.button.danger{background:#b33a3a}
.button.small,button.small{padding:8px 11px;font-size:13px}
.full{width:100%;margin-top:16px}
.alert{padding:12px 14px;border-radius:10px;margin-bottom:16px;background:#ffe8e8;color:#a32121}
.success{background:#e5f7ef;color:#176b52}
.info{background:#e8f2ff;color:#245a91}
.center{text-align:center}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.actions .button{flex:1}
.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
table{width:100%;border-collapse:collapse;margin-top:15px}
th,td{padding:11px;border-bottom:1px solid #e2ebe7;text-align:left;vertical-align:top}
th{background:#edf6f2}
.badge{display:inline-block;padding:5px 9px;border-radius:99px;font-size:12px;font-weight:700}
.badge.pending{background:#fff1d6;color:#8b5a00}
.badge.approved{background:#e5f7ef;color:#176b52}
.badge.completed{background:#e8f2ff;color:#245a91}
.badge.rejected{background:#ffe8e8;color:#a32121}
.small{font-size:13px;color:#667b74}
.secret{word-break:break-all;background:#f4f7f6;padding:12px;border-radius:10px;font-family:monospace}
#qrcode{display:flex;justify-content:center;margin:20px 0}
.inline-form{display:inline}
@media(max-width:700px){table{display:block;overflow-x:auto}.container{margin:18px auto}.card{padding:18px}}

.intranet-launch {
    width: 100%;
    margin: 32px auto;
    padding: 35px 25px;
    text-align: center;
    background: linear-gradient(
        145deg,
        #f0faf6,
        #ffffff
    );
    border: 2px solid #b8ddd0;
    border-radius: 22px;
    box-shadow:
        0 15px 35px rgba(23, 107, 82, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.intranet-icon {
    width: 70px;
    height: 70px;
    margin: 0 auto 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #dff4ec;
    border-radius: 50%;
    font-size: 34px;
}

.intranet-launch h2 {
    margin: 0 0 10px;
    color: #176b52;
    font-size: 28px;
    font-weight: 800;
}

.intranet-launch p {
    margin: 0 0 25px;
    color: #607d74;
    font-size: 15px;
    line-height: 1.7;
}

.open-intranet-button {
    width: 100%;
    max-width: 420px;
    min-height: 70px;
    padding: 16px 30px;
    border: 0;
    border-radius: 16px;
    background: linear-gradient(
        135deg,
        #238566,
        #176b52
    );
    color: #ffffff;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: 0.4px;
    cursor: pointer;
    box-shadow:
        0 12px 25px rgba(23, 107, 82, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.25);
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.open-intranet-button:hover {
    transform: translateY(-3px);
    box-shadow:
        0 17px 30px rgba(23, 107, 82, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.open-intranet-button:active {
    transform: translateY(0);
}

.open-icon {
    display: inline-block;
    margin-right: 8px;
    font-size: 28px;
}

@media (max-width: 600px) {
    .intranet-launch {
        padding: 26px 15px;
    }

    .intranet-launch h2 {
        font-size: 23px;
    }

    .open-intranet-button {
        min-height: 62px;
        font-size: 20px;
    }
}
