/* SYSTJEM 11.84.0 - standalone Tikklok app shell */
body.tikklok-native-shell{
  background:#f4f1e9!important;
  min-height:100dvh;
  overflow-x:hidden!important;
}
body.tikklok-native-shell .systjem-loader{background:#f4f1e9}
body.tikklok-native-shell .admin-wrap{
  width:100%!important;
  max-width:760px!important;
  margin:0 auto!important;
  padding:calc(env(safe-area-inset-top) + 18px) 18px calc(env(safe-area-inset-bottom) + 28px)!important;
}
body.tikklok-native-shell .autosave-footer,
body.tikklok-native-shell .session-topbar,
body.tikklok-native-shell .admin-hero,
body.tikklok-native-shell .primary-nav,
body.tikklok-native-shell #mobileNavFixedToggle,
body.tikklok-native-shell #mobileNavOverlay,
body.tikklok-native-shell #sidebarToggle{display:none!important}

.tik-app-brand{
  display:flex;align-items:center;gap:14px;
  margin:0 0 18px;padding:2px 4px 14px;
  border-bottom:1px solid rgba(33,51,43,.12)
}
.tik-app-brand>div:last-child{display:grid;line-height:1.05}
.tik-app-brand span{font-size:12px;font-weight:850;letter-spacing:.16em;color:#8b6938}
.tik-app-brand strong{font-size:28px;letter-spacing:-.03em;color:#1f2b25;margin-top:4px}
.tik-app-brand small{font-size:13px;color:#68746d;margin-top:6px}
.tik-app-mark{position:relative;width:58px;height:58px;flex:0 0 58px}
.tik-app-mark img{display:block;width:58px;height:58px;border-radius:15px;box-shadow:0 8px 22px rgba(21,42,33,.13)}
.tik-app-clock{
  position:absolute;right:-5px;bottom:-5px;width:25px;height:25px;border-radius:50%;
  background:#fff;border:2px solid #1d4638;box-shadow:0 4px 10px rgba(20,40,32,.18)
}
.tik-app-clock:before,.tik-app-clock:after{content:"";position:absolute;left:11px;top:5px;width:2px;background:#1d4638;border-radius:2px;transform-origin:bottom center}
.tik-app-clock:before{height:7px;transform:rotate(0deg)}
.tik-app-clock:after{height:6px;transform:rotate(125deg)}

body.tikklok-native-shell .tik-hero{display:none!important}
body.tikklok-native-shell .tik-admin-picker,
body.tikklok-native-shell .tik-clock-card,
body.tikklok-native-shell .tik-pin-card,
body.tikklok-native-shell .card{
  border:1px solid rgba(52,70,60,.11)!important;
  box-shadow:0 12px 34px rgba(30,46,37,.07)!important;
}
body.tikklok-native-shell .tik-admin-picker{border-radius:22px!important;padding:18px!important;background:#fff!important;margin-bottom:14px!important}
body.tikklok-native-shell .tik-admin-picker .eyebrow{color:#9a7440}
body.tikklok-native-shell .tik-admin-picker h3{margin:5px 0 12px;font-size:24px}
body.tikklok-native-shell .tik-admin-picker select{min-height:52px;border-radius:14px!important;background:#f9faf8!important}
body.tikklok-native-shell .tik-clock-card{border-radius:26px!important;padding:22px!important;background:#fff!important}
body.tikklok-native-shell .tik-person h3{font-size:34px;margin-bottom:24px}
body.tikklok-native-shell .tik-type-grid{grid-template-columns:1fr 1fr;gap:12px}
body.tikklok-native-shell .tik-type-grid button{
  min-height:96px!important;border:0!important;border-radius:20px!important;
  background:#1f2722!important;color:#fff!important;font-size:18px!important;font-weight:800!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.05),0 8px 18px rgba(25,35,29,.08)
}
body.tikklok-native-shell .tik-type-grid button:active{transform:scale(.985)}
body.tikklok-native-shell .tik-running{border-radius:22px;background:#edf4ef;padding:24px}
body.tikklok-native-shell .tik-running strong{font-size:24px}
body.tikklok-native-shell .tik-timer{font-size:52px;letter-spacing:-.04em}
body.tikklok-native-shell .tik-stop{border-radius:20px;padding:20px;font-size:21px}
body.tikklok-native-shell .tik-totals>div{border-radius:18px;padding:18px;background:#f5f6f3}
body.tikklok-native-shell .tik-entry-row{background:#fff;border:1px solid #e5e8e4;border-radius:18px;padding:15px!important;margin-bottom:10px}
body.tikklok-native-shell .tik-entry-row.corrected{border-left:4px solid #c7a34e}
body.tikklok-native-shell .tik-pin-card{margin:20px auto!important;border-radius:26px!important;padding:24px!important}
body.tikklok-native-shell .tik-pin-card input{min-height:62px;border-radius:16px;font-size:30px}
body.tikklok-native-shell .tik-pin-card .primary{width:100%;min-height:58px;border-radius:17px;margin-top:12px}

@media(max-width:560px){
  body.tikklok-native-shell .admin-wrap{padding-left:14px!important;padding-right:14px!important}
  body.tikklok-native-shell .tik-type-grid{grid-template-columns:1fr}
  body.tikklok-native-shell .tik-type-grid button{min-height:76px!important}
  body.tikklok-native-shell .tik-clock-card{padding:18px!important}
  body.tikklok-native-shell .tik-timer{font-size:46px}
}
