/* ===== V71 shared admin shell =====
   - smooth page-to-page transitions on every page (cross-document View Transitions; browsers without it just navigate)
   - the master side menu / location bar used by index.html and every master-mode sub page */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.16s;animation-timing-function:ease-out}
@media (prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}
@keyframes nbxIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

.m-side,.m-crumb{display:none}
.m-side{view-transition-name:nbx-side;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif;font-size:13px;line-height:1.5;letter-spacing:normal}
.m-crumb{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif;line-height:1.35}
/* location (crumb) */
.m-crumb-ico{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#156cff,#2154d1);color:#fff;font-size:13px;font-weight:900;flex:0 0 auto}
.m-crumb-txt{display:flex;flex-direction:column;min-width:0}
.m-crumb-txt small{font-size:11px;font-weight:800;color:#64748b;letter-spacing:.04em}
.m-crumb-txt b{font-size:18px;font-weight:900;color:#101828;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(min-width:1024px){
 body.m-authed .m-side,html.nbx-master .m-side{display:flex}
 body.m-authed .m-crumb,html.nbx-master .m-crumb{display:flex;align-items:center;gap:10px;min-width:0}
 .m-side{position:fixed;left:0;top:0;bottom:0;z-index:110;width:252px;flex-direction:column;background:#0f1d33;color:#dbe5f3;box-shadow:4px 0 24px rgba(15,23,42,.10)}
 .m-side-brand{padding:16px 18px 10px;border-bottom:1px solid rgba(255,255,255,.07)}
 .m-side-brand b{display:block;font-size:15px;font-weight:900;letter-spacing:.08em;color:#fff}
 .m-side-brand small{display:flex;align-items:center;gap:6px;margin-top:4px;font-size:11px;color:#9fb0c8}
 .m-side-brand small i{font-style:normal;padding:1px 7px;border-radius:999px;background:rgba(255,255,255,.12);color:#fff;font-size:10px;font-weight:800}
 .m-side-search{display:flex;align-items:center;gap:8px;margin:10px 12px 2px;padding:8px 11px;border:1px solid rgba(255,255,255,.12);border-radius:11px;background:rgba(255,255,255,.06);color:#c4d2e6;font:inherit;font-size:12.5px;cursor:pointer;text-align:left}
 .m-side-search:hover{background:rgba(255,255,255,.10)}
 .m-side-search span{flex:1 1 auto}
 .m-side-search kbd{font:inherit;font-size:10.5px;padding:1px 6px;border-radius:6px;border:1px solid rgba(255,255,255,.2);color:#9fb0c8}
 .m-side-nav{flex:1 1 auto;overflow-y:auto;padding:4px 10px 14px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}
 .m-side-gt{display:flex;align-items:center;gap:7px;margin:11px 8px 3px;font-size:11px;font-weight:900;letter-spacing:.08em;color:#8193ad}
 .m-side-gt span{display:grid;place-items:center;width:18px;height:18px;border-radius:6px;background:rgba(255,255,255,.08);font-size:9.5px;color:#c4d2e6}
 .m-side-item{position:relative;display:flex;align-items:center;gap:9px;width:100%;min-height:30px;padding:4px 10px;margin:1px 0;border:0;border-radius:9px;background:transparent;color:#d6e0ee;font:inherit;font-size:13px;font-weight:700;text-decoration:none;text-align:left;cursor:pointer}
 .m-side-item:hover{background:rgba(255,255,255,.07);color:#fff}
 .m-side-item:focus-visible{outline:2px solid #6ea2ff;outline-offset:-2px}
 .m-side-item .m-ico{display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:rgba(255,255,255,.08);font-size:10.5px;font-weight:900;flex:0 0 auto}
 .m-side-item .m-lbl{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .m-side-item .m-out{font-size:10px;color:#7f92ad}
 .m-side-item.on{background:linear-gradient(135deg,#1d6bff,#2456d6);color:#fff;box-shadow:0 6px 16px rgba(29,107,255,.28)}
 .m-side-item.on .m-ico{background:rgba(255,255,255,.2)}
 .m-side-item .nbns-badge{flex:0 0 auto}
 .m-side-home{margin-top:6px}
 .m-side-foot{padding:9px 16px 11px;border-top:1px solid rgba(255,255,255,.07);font-size:11.5px;color:#9fb0c8;line-height:1.5}
 .m-side-foot b{display:block;color:#fff;font-size:13px}
 .m-side-group+.m-side-group{margin-top:2px}
}
@media(min-width:1024px) and (max-height:960px){.m-side-item{min-height:27px;padding:3px 10px}.m-side-item .m-ico{width:20px;height:20px}.m-side-gt{margin-top:8px}.m-side-foot{display:none}}

/* ---- master-mode sub pages (shift / attendance / growth / staff-analysis / income-sim / accounts) ---- */
html.nbx-master body{
 background:radial-gradient(circle at top left,rgba(31,111,255,.08),transparent 26%),radial-gradient(circle at top right,rgba(242,196,109,.10),transparent 20%),linear-gradient(180deg,#f5f7fb 0%,#edf2f7 100%) fixed;
 color:#101828;min-height:100vh;
}
html.nbx-master{--blue:#1f6fff;--green:#1f6fff;--soft:#f3f7ff;--bg:transparent}
html.nbx-master .nbx-hidden{display:none!important}
.nbx-bar{display:none}
html.nbx-master .nbx-bar{
 position:sticky;top:0;z-index:95;display:flex;align-items:center;justify-content:space-between;gap:12px;
 margin:0 auto 14px;padding:12px 18px;max-width:1220px;font-size:14px;line-height:1.4;
 background:rgba(255,255,255,.86);border:1px solid rgba(228,233,241,.95);border-top:0;border-radius:0 0 16px 16px;
 box-shadow:0 10px 28px rgba(15,23,42,.06);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
 view-transition-name:nbx-bar;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif;
}
body.m-authed .top{view-transition-name:nbx-bar}
.nbx-bar-main{display:flex;align-items:center;gap:10px;min-width:0;border:0;background:transparent;padding:0;margin:0;font:inherit;color:inherit;text-align:left;cursor:pointer;min-height:0}
.nbx-bar-main:hover{filter:none}
.nbx-menu{display:none}
.nbx-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.nbx-actions button,.nbx-actions .button,.nbx-actions .btn,.nbx-actions a{min-height:40px;padding:9px 15px;border-radius:10px;border:1px solid #e1e8f1;background:#fff;color:#101828;font:inherit;font-size:14px;font-weight:700;box-shadow:none;text-decoration:none;cursor:pointer;display:inline-flex;align-items:center;white-space:nowrap}
.nbx-actions button:hover,.nbx-actions a:hover{background:#f3f7ff}
html.nbx-master .m-crumb{display:flex;align-items:center;gap:10px;min-width:0}
@media(min-width:1024px){
 /* same frame as index.html: 252px menu, content from the left, up to 1480px wide */
 html.nbx-master body{padding-left:252px;padding-top:18px}
 /* dark column painted before the menu itself is built, so nothing shifts or flashes while a page loads */
 html.nbx-master body::before,body.m-authed::before{content:'';position:fixed;left:0;top:0;bottom:0;width:252px;background:#0f1d33;z-index:100}
 html.nbx-master .nbx-bar{margin:0 28px 14px;max-width:1424px}
 html.nbx-master .shell,html.nbx-master body>main,html.nbx-master .wrap{max-width:1480px;margin:0;padding:0 28px 48px}
}
@media(max-width:1023px){
 html.nbx-master .nbx-bar{margin:0 8px 10px;padding:8px 10px;border-radius:0 0 14px 14px}
 html.nbx-master .nbx-menu{display:grid;place-items:center;flex:0 0 auto;width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,#156cff,#2154d1);color:#fff;font-size:17px;font-weight:900}
 html.nbx-master .m-crumb-ico{display:none}
 html.nbx-master .m-crumb-txt b{font-size:15.5px}
 .nbx-actions button,.nbx-actions a{min-height:34px;padding:6px 10px;font-size:12px}
}
/* page specific: keep each page's content but drop its own header / banner */
html.nbx-master .shell{padding-top:0}
html.nbx-master main{padding-top:0}
html.nbx-master #nav{margin-top:0}
/* shift.html: on PC the side menu already lists 休みカレンダー / 店休設定 / … so its own tab row is dropped */
@media(min-width:1024px){html.nbx-master #nav.nav{display:none}}
@media(max-width:760px){html.nbx-master .nav{top:58px}}
body.sa-present-mode .nbx-bar,body.isim-present-mode .nbx-bar,body.sa-present-mode .m-side,body.isim-present-mode .m-side{display:none!important}
@media(min-width:1024px){body.sa-present-mode,body.isim-present-mode{padding-left:0!important}}
@media print{.m-side,.nbx-bar{display:none!important}html.nbx-master body{padding-left:0!important;background:#fff}}

/* ===== V71: sub pages take the look of the top page (index.html) =====
   Same card, button, tab, table, heading and text colors. Zero-specificity :where() is used for the base button
   so calendar cells and other specially styled buttons keep their own look. */
html.nbx-master body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif;color:#101828}
html.nbx-master :is(.card,.panel),html.nbx-page-growth.nbx-master .toolbar{border:1px solid #e4e9f1;border-radius:20px;background:rgba(255,255,255,.94);box-shadow:0 18px 48px rgba(15,23,42,.09)}
html.nbx-master .card.flush{padding:0}
html.nbx-master :is(.muted,p.muted,.tiny,.lead){color:#667085}
html.nbx-master :is(main,.shell,.wrap) h2{font-weight:900;color:#101828;letter-spacing:0}
html.nbx-master .section-head h2,html.nbx-page-attendance.nbx-master #content h2,html.nbx-page-growth.nbx-master .panel h2{font-size:22px}
html.nbx-master th{background:#f8fafc;color:#667085;font-weight:800;border-bottom:1px solid #e4e9f1}
html.nbx-master td{border-color:#edf1f5}
html.nbx-master :is(input,select,textarea){border-color:#d8e1ef;border-radius:10px}
html.nbx-master :is(input,select,textarea):focus{outline:2px solid #95b7ff;outline-offset:1px}

/* buttons: primary = blue gradient, secondary = white with a thin border (as on the top page) */
:where(html.nbx-page-shift,html.nbx-page-attendance) button,
html.nbx-master .btn:not(.secondary):not(.danger),
html.nbx-master :is(.primary,.button:not(.secondary)){background:linear-gradient(135deg,#1f6fff 0%,#0f4de0 100%);color:#fff;border-color:transparent;border-radius:12px}
html.nbx-master :is(.btn,.primary,.button):not(.secondary):not(.danger){box-shadow:0 8px 20px rgba(31,111,255,.18)}
html.nbx-master :is(.btn.secondary,button.secondary,.button.secondary,button.quiet){background:#fff;color:#344054;border:1px solid #d8e1ef;border-radius:12px;box-shadow:none}
html.nbx-master :is(.btn.danger,button.danger){background:linear-gradient(135deg,#c0392b,#9f1d17);color:#fff;border-color:transparent}
html.nbx-master button.link{background:none;box-shadow:none}

/* tab rows (shift on phone/tablet, attendance, growth's 自分/店舗 switch) = the top page's pill tabs */
html.nbx-master #nav.nav,html.nbx-page-attendance.nbx-master .tabs{gap:9px}
html.nbx-master :is(#nav.nav button,.scope button),html.nbx-page-attendance.nbx-master .tabs button{border-radius:999px;padding:10px 14px;border:1px solid #dce4ef;background:#fff;color:#344054;font-weight:750;box-shadow:none;min-height:40px}
html.nbx-master :is(#nav.nav button.on,.scope button.active),html.nbx-page-attendance.nbx-master .tabs button.on{background:linear-gradient(135deg,#1f6fff,#0f4de0);border-color:transparent;color:#fff;box-shadow:0 9px 22px rgba(31,111,255,.28)}
html.nbx-master .scope{background:transparent;padding:0;gap:9px}

/* page bits that had their own colors */
html.nbx-page-attendance.nbx-master .filters label{color:#667085}
html.nbx-master.nbx-page-growth{--ink:#101828;--muted:#667085;--line:#e4e9f1;--soft:#f3f7ff}
html.nbx-master.nbx-page-shift{--ink:#101828;--muted:#667085;--line:#e4e9f1;--radius:20px}
html.nbx-master .nbx-head{padding:20px;margin:0 0 14px;background:linear-gradient(180deg,#ffffff 0%,#fbfcfe 100%)}
html.nbx-master .nbx-head .section-title{font-size:22px;font-weight:900;color:#101828;margin:0}
html.nbx-master .nbx-head .section-desc{color:#667085;margin-top:5px;line-height:1.6;font-size:14px}
@media(max-width:760px){html.nbx-master .nbx-head{padding:14px 16px}html.nbx-master .nbx-head .section-title{font-size:19px}}