.clock-card{background:#123e34;color:#fff;border-radius:15px;padding:25px 28px;margin-bottom:25px;border:1px solid #123e34;box-shadow:0 8px 30px #123e3410}.clock-label{display:flex;gap:8px;align-items:center;font-size:11px;letter-spacing:1.3px;font-weight:700;color:#d8edb7}.clock-label svg{width:22px;height:22px}.clock-tag{background:#ffffff15;border:1px solid #ffffff25;border-radius:20px;padding:5px 11px;font-size:11px;white-space:nowrap}.clock-card h2{font-size:25px;line-height:1.4;margin:17px 0 7px;letter-spacing:-.8px}.clock-card p{font-size:12px;color:#c8d9ce;margin-bottom:17px}.clock-card label{font-size:11px;color:#d8e7da;margin:16px 0 7px}.clock-card select{max-width:350px;border-color:#ffffff30;background:#fff;color:#173e34}.clock-buttons{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px;max-width:600px}.clock-buttons .btn{font-size:22px;font-weight:700;min-height:66px;background:#ffffff0d;color:#ffffff9a;border:1px solid #ffffff30}.clock-buttons .btn svg{width:24px;height:24px}.clock-buttons .btn.primary{background:#d8edb7;color:#173e34;border-color:#d8edb7}.clock-buttons .btn:disabled{opacity:.4;cursor:not-allowed}.clock-footer{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:10px;color:#b4c9b7;margin-top:19px;border-top:1px solid #ffffff1a;padding-top:14px}.clock-card.working{background:#fff5df;color:#644a1e;border:1px solid #e7cd92;box-shadow:none}.working .clock-label{color:#937128}.working .clock-tag{background:#f2dfb5;border-color:#e5ca8c;color:#73541b}.working p,.working .clock-footer{color:#8b754e}.working .clock-footer{border-color:#e8d7b3}.working .clock-buttons .btn{border-color:#dbcaa8;background:#fff9ec;color:#8b754e}.working .clock-buttons .btn.primary{background:#123e34;border-color:#123e34;color:#fff}.clock-reminder{display:flex;gap:12px;align-items:center;text-align:left;width:100%;padding:14px 18px;background:#fff1d2;border:1px solid #e9d194;border-radius:11px;color:#70541f;margin-bottom:22px}.clock-reminder span{flex:1}.clock-reminder b{display:block;font-size:12px}.clock-reminder small{display:block;font-size:10px;margin-top:2px}
@media(max-width:760px){.clock-card{padding:20px 17px;border-radius:13px;margin-bottom:20px}.clock-card h2{font-size:23px;line-height:1.4;margin-top:16px}.clock-card p{font-size:11px;line-height:1.8}.clock-label{font-size:9px;letter-spacing:1px}.clock-label svg{width:19px;height:19px}.clock-tag{font-size:9px;padding:4px 9px}.clock-buttons .btn{font-size:23px;min-height:70px}.clock-footer{display:grid;gap:5px;font-size:9px}.clock-reminder{padding:12px;margin-bottom:18px}.nav[data-go=attendance]{font-weight:700;color:#416930}.nav[data-go=attendance] svg{width:23px;height:23px}}