.rh-app { max-width: 920px; margin: 20px auto; background: linear-gradient(180deg, #f4e, #f96); padding: 24px; border-radius: 20px; box-shadow: 0 10px 30px rgba(0,0,0,.1); }
.rh-topbar { display:flex; justify-content: space-between; align-items:center; }
.rh-brand { font-weight: 800; font-size: 24px; opacity: .9; color:#fff; }
.rh-sync { background:#e7fff0; border:0; padding:8px 12px; border-radius: 12px; cursor:pointer; }
.rh-panel { background: #f3f4f6; color:#111; border-radius: 18px; padding: 24px; margin-top: 14px; }
.rh-greeting { font-size: 18px; margin-bottom: 12px; }
.rh-greeting small { display:block; color:#444; }
.rh-clock { font-size: 54px; text-align:center; margin: 12px 0 12px; }
.rh-cta { display:flex; gap: 12px; justify-content:center; flex-wrap:wrap; }
.rh-btn { border:0; border-radius: 50px; padding: 16px 28px; font-size: 16px; cursor: pointer; box-shadow: 0 6px 18px rgba(0,0,0,.12); transition: transform 0.2s ease; }
.rh-btn:hover { transform: scale(1.05); }
.rh-btn.hold-in { background:#00b894; color:#fff; } 
.rh-btn.hold-out { background:#ff4d4d; color:#fff; }
.rh-msg { margin-top:10px; text-align:center; font-weight:600; }
.rh-table{width:100%;border-collapse:collapse;margin-top:10px}
.rh-table th,.rh-table td{border:1px solid #ddd;padding:8px}
.rh-table thead{background:#e5e7eb;font-weight:700}
.rh-daily{margin-top:8px;font-weight:600}
.rh-card.rh-login { max-width:420px; margin:40px auto; background:#2c2c2c; color:#f1f1f1; border-radius:20px; padding:24px; box-shadow: 0 10px 24px rgba(0,0,0,.25); text-align:center; }
.rh-card.rh-login input { background:#444; border:1px solid #666; color:#fff; padding:10px; border-radius:8px; width:100%; }
.rh-logo { font-size: 46px; font-weight:900; background: linear-gradient(45deg, #ff5, #f65); -webkit-background-clip:text; color:transparent; margin-bottom: 10px; }
button:disabled{opacity:.6; cursor:not-allowed}