/* 年末調整アプリの質感を青の運行アプリへ適用。配置・寸法・文字サイズは現行維持。 */
.login-card{
  border-radius:26px;
  box-shadow:inset 0 0 0 1px rgba(217,226,236,.92),0 12px 32px rgba(26,73,115,.11);
}
.panel:not(.start-info-panel){
  box-shadow:inset 0 0 0 1px rgba(217,226,236,.92),0 12px 32px rgba(26,73,115,.11);
}
input,select,textarea{
  border-radius:17px;
  box-shadow:0 2px 5px rgba(26,73,115,.025);
}
.btn{
  border-radius:17px;
}
.btn-primary{
  box-shadow:0 4px 12px rgba(26,115,232,.14);
}
.btn-danger{
  box-shadow:0 4px 12px rgba(217,48,37,.14);
}

/* 年調の背景・カード・ローディングをブルーへ。運行ハンドラーは変更しない。 */
html,body,.app,.app-login,.centered-screen,.start-screen-centered{
 background:radial-gradient(circle at 12% 8%,rgba(209,226,250,.78),transparent 30%),radial-gradient(circle at 90% 92%,rgba(218,233,252,.68),transparent 32%),#eef4fb!important;
}
.login-top{color:var(--blue)!important;}
.loading-overlay{background:rgba(245,248,253,.84);backdrop-filter:blur(2px);padding:20px;}
.loading-box{border-radius:20px;padding:24px 20px;box-shadow:0 12px 32px rgba(26,73,115,.11);}
.loading-spinner{width:52px;height:52px;margin:0 auto 12px;border-color:#dde7f4;border-top-color:var(--blue);}
.install-guide{margin-top:18px;padding:16px;border:1px solid #d5e2f2;border-radius:20px;background:#fff;box-shadow:0 8px 24px rgba(26,73,115,.06);color:#334155;}
.install-guide summary{cursor:pointer;font-weight:800;color:var(--blue);}
.install-guide p{margin:10px 0;line-height:1.65;font-size:18px;}
.install-guide button{width:100%;min-height:52px;padding:12px;border:1px solid var(--blue);border-radius:14px;background:var(--blueSoft);color:var(--blue);font-weight:800;cursor:pointer;font-size:18px;}
.install-guide button[hidden]{display:none;}
@media(min-width:900px){
 :root{--input-h:54px;--btn-h:56px;--card-pad-x:22px;--card-pad-y:22px;}
 .login-shell{max-width:520px!important;}
 .content-wrap{max-width:760px!important;}
 .login-brand{font-size:38px!important;}.login-copy{font-size:18px!important;}
 .login-card-title{font-size:28px!important;}
 label{font-size:18px!important;margin:14px 0 7px;}
 input,select,textarea,.readonly-like{font-size:18px!important;min-height:54px!important;padding:12px!important;}
 input[type=checkbox],input[type=radio]{min-height:0!important;padding:0!important;}
 .btn,.stamp-list .btn,.stamp-list .btn-secondary,.btn-submenu,.progress-end-wide,.btn-progress-wide{font-size:20px!important;min-height:56px!important;padding:12px 16px!important;}
 .status-panel,.start-info-panel,#sessionInfo,#loginUserInfo{font-size:19px!important;line-height:1.7!important;}
 #sessionInfo .meta-small,#loginUserInfo .meta-small,.status-panel .meta-small{font-size:18px!important;line-height:1.7!important;}
 .loading-text{font-size:18px;}
 .live-clock-label{font-size:18px;}.live-clock{font-size:34px;}
}

@media(min-width:900px){
 #eventStartPlaceWrap,#eventStartPlace,.check{font-size:18px!important;}
 .attendant-chooser-overlay .attendant-chooser-title{font-size:24px!important;}
 .attendant-chooser-overlay .attendant-chooser-item,.attendant-chooser-overlay .attendant-chooser-actions .btn{font-size:20px!important;}
}

/* 打刻メニュー：操作の順序・名称を保ち、文字と高さを統一。 */
#mainScreen #mainLoginShell{width:100%;max-width:560px!important;}
#mainScreen .login-card{padding:24px!important;}
#mainScreen .login-brand{font-size:30px!important;line-height:1.3;}
#mainScreen #sessionInfo{font-size:18px!important;line-height:1.65!important;padding:18px!important;}
#mainScreen #sessionInfo .meta-small{font-size:16px!important;line-height:1.65!important;}
#mainScreen #lastCompletedInfo{font-size:17px!important;line-height:1.65;margin:18px 0;}
#mainScreen .stamp-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch;}
#mainScreen .stamp-list .btn{height:auto!important;min-height:84px!important;padding:12px 10px!important;font-size:22px!important;line-height:1.4!important;display:flex;align-items:center;justify-content:center;border-radius:14px;box-sizing:border-box;}
#mainScreen .stamp-list .btn .btn-text{font-size:inherit!important;line-height:inherit;word-break:normal;overflow-wrap:normal;line-break:strict;text-wrap:balance;}
#mainScreen #mainBottomButtons{gap:12px;margin-top:24px;}
#mainScreen #mainBottomButtons button{font-family:inherit!important;font-size:18px!important;line-height:1.4!important;min-height:52px!important;height:auto!important;padding:12px 16px!important;border-radius:14px!important;box-sizing:border-box;}
#mainScreen #mainBottomButtons button[onclick="openDriverMidReport()"],
#mainScreen #mainBottomButtons button[onclick="openAttendantMidReport()"]{font-size:21px!important;min-height:62px!important;gap:10px!important;box-shadow:0 4px 12px rgba(63,115,218,.14)!important;}
#mainScreen #mainBottomButtons button span{font-size:inherit!important;}
@media(max-width:480px){
 #mainScreen .login-card{padding:18px!important;}
 #mainScreen .stamp-list{gap:10px;}
 #mainScreen .stamp-list .btn{font-size:20px!important;min-height:82px!important;padding:10px 8px!important;}
 #mainScreen #sessionInfo{padding:14px!important;}
}

/* 下部操作を同じ寸法に統一。最終打刻は役割ごとに1行。 */
#mainScreen #mainBottomButtons button,
#mainScreen #mainBottomButtons button[onclick="openDriverMidReport()"],
#mainScreen #mainBottomButtons button[onclick="openAttendantMidReport()"]{
 min-height:56px!important;padding:12px 14px!important;font-size:20px!important;line-height:1.4!important;border-radius:14px!important;
}
#mainScreen #lastCompletedInfo .last-stamp-line{font-size:17px!important;line-height:1.8!important;white-space:nowrap;overflow-x:auto;}
@media(max-width:480px){
 #mainScreen #lastCompletedInfo .last-stamp-line{font-size:clamp(13px,3.7vw,17px)!important;}
}

/* ログインの寸法は年末調整アプリのstyles.cssと同じ。 */
#loginScreen{
 min-height:100vh;min-height:100svh;
 padding:max(20px,env(safe-area-inset-top)) 8px max(24px,env(safe-area-inset-bottom))!important;
 font-family:"Noto Sans JP","Yu Gothic","Meiryo",sans-serif;
 font-size:16px;line-height:1.6;
}
#loginScreen.active{display:flex;align-items:center;justify-content:center;}
#loginScreen .login-shell{max-width:520px!important;padding-bottom:0;margin:0 auto;}
#loginScreen .login-top{padding:10px 6px 18px!important;}
#loginScreen .login-brand{font-size:clamp(30px,8vw,42px)!important;line-height:1.12!important;font-weight:900;letter-spacing:normal;}
#loginScreen .login-copy{margin-top:7px!important;font-size:clamp(17px,4.4vw,21px)!important;font-weight:800;line-height:1.6;}
#loginScreen .login-card{padding:22px 18px 24px!important;border-radius:26px!important;border:1px solid rgba(217,226,236,.92);gap:0;box-shadow:0 12px 32px rgba(26,73,115,.11);}
#loginScreen .login-card-title{margin:0 0 8px!important;font-size:32px!important;line-height:1.2!important;font-weight:900;}
#loginScreen label{margin:17px 0 7px!important;font-size:20px!important;line-height:1.6;}
#loginScreen input{font-family:inherit;min-height:60px!important;height:auto!important;padding:12px 15px!important;border-radius:17px!important;font-size:18px!important;line-height:1.6;box-shadow:none;}
#loginScreen .btn{font-family:inherit;min-height:60px!important;height:auto!important;margin-top:18px!important;padding:12px 14px!important;border-radius:17px!important;font-size:20px!important;line-height:1.6;}
@media(min-width:768px){
 #loginScreen{font-size:15px;padding-top:46px!important;}
 #loginScreen .login-shell{max-width:470px!important;}
 #loginScreen .login-brand{font-size:30px!important;}
 #loginScreen .login-copy{font-size:16px!important;}
 #loginScreen .login-card{padding:24px 26px 28px!important;border-radius:20px!important;}
 #loginScreen .login-card-title{font-size:27px!important;}
 #loginScreen label{font-size:16px!important;}
 #loginScreen input{min-height:50px!important;border-radius:12px!important;font-size:16px!important;}
 #loginScreen .btn{min-height:52px!important;border-radius:12px!important;font-size:17px!important;}
}

/* 年調同様、タイトルとカードのまとまりを中央に配置。長い画面は縦スクロール。 */
.app-login.active,.centered-screen.active,.start-screen-centered.active{
 display:flex;flex-direction:column;align-items:center;justify-content:center;
 min-height:100vh;min-height:100svh;height:auto;
}
.app-login>.login-shell,.centered-screen>.login-shell,.start-screen-centered>.login-shell{
 margin: auto!important;flex-shrink:0;padding-bottom:0!important;
}
#loginScreen{padding-top:max(24px,env(safe-area-inset-top))!important;padding-bottom:max(24px,env(safe-area-inset-bottom))!important;}
.login-design-notice{display:none!important;}

/* スクロール領域を画面内に一本化し、中央配置の余白が動くのを防ぐ。 */
html,body{height:100%;overflow:hidden;}
.app{height:100vh;height:100svh;min-height:0;overflow:hidden;}
.app>.screen{
 height:100%;min-height:0!important;max-height:100%;
 overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;
 box-sizing:border-box;
}
.app>.app-login.active,.app>.centered-screen.active,.app>.start-screen-centered.active{
 justify-content:flex-start;align-items:center;
 padding-top:max(16px,env(safe-area-inset-top));
 padding-bottom:max(16px,env(safe-area-inset-bottom));
}
.app>.screen>.login-shell{margin:auto!important;flex:0 0 auto;}
