/* StockIn アプリ本体（base.css の上に重ねる） */

body.is-booting main section { visibility: hidden; }

.bar { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 5; background: var(--paper); border-bottom: 1.5px solid var(--rule); }
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 10; background: var(--paper); }
.bar-in { max-width: var(--wrap); margin-inline: auto; display: flex; align-items: center; gap: var(--s5); min-height: 56px; }
.brand { display: flex; align-items: center; gap: var(--s2); font-weight: 700; text-decoration: none; }
.tabs { display: flex; gap: 0; align-self: stretch; }
.tab { border: 0; background: transparent; padding: 0 var(--s4); cursor: pointer; font-weight: 700; color: var(--ink-2); border-bottom: 3px solid transparent; margin-bottom: -1.5px; }
.tab:hover { color: var(--ink); }
.tab[aria-current="page"] { color: var(--ink); border-bottom-color: var(--ink); }
.tab:disabled { opacity: .4; cursor: not-allowed; }
.who { margin-left: auto; display: flex; gap: var(--s4); align-items: center; font-size: var(--t-sm); color: var(--ink-2); }

.main-in { padding-block: var(--s5) var(--s8); display: grid; gap: var(--s4); }
.note-band { font-size: var(--t-sm); padding: var(--s2) var(--s4); border: 1px solid var(--rule); background: var(--paper-2); }
.boot { color: var(--ink-2); }
.blocked { display: grid; gap: var(--s4); max-width: 40em; padding-block: var(--s6); }
.blocked h1 { font-family: var(--f-title); font-size: var(--t-lg); }

.scan-msg { font-size: var(--t-sm); padding: 0 var(--s4); }
.scan-msg:empty { display: none; }
.scan-msg.ok { color: var(--ok); padding-block: var(--s2); }
.scan-msg.err { color: var(--shu); padding-block: var(--s2); font-weight: 700; }
.csv-pick { max-width: 360px; }

/* 設定 */
.set-block { display: grid; gap: var(--s3); padding-bottom: var(--s6); border-bottom: 1px solid var(--rule-soft); margin-bottom: var(--s5); }
.set-title { font-family: var(--f-title); font-size: var(--t-lg); font-weight: 700; }
h2.set-title { font-size: var(--t-md); }
.set-lead { color: var(--ink-2); max-width: 46em; }
.set-table { width: 100%; border-collapse: collapse; border: 1.5px solid var(--rule); min-width: 560px; }
.set-table th { font-weight: 400; font-size: var(--t-sm); color: var(--ink-2); text-align: left; padding: var(--s2) var(--s3); border-bottom: 1px solid var(--rule); white-space: nowrap; }
.set-table td { padding: var(--s2) var(--s3); border-bottom: 1px solid var(--rule-soft); }
.set-table .c { text-align: center; }
.set-table input[type=checkbox], .set-row input[type=checkbox] { width: 20px; height: 20px; accent-color: var(--ink); vertical-align: middle; }
.set-table .input, .set-table .select { min-height: 36px; }
.set-table input.short { width: 6em; }
.set-table tr.off td:not(:first-child):not(:nth-child(2)) { opacity: .45; }
.set-row { display: flex; align-items: center; gap: var(--s3); flex-wrap: wrap; }
.set-row .input { width: 7em; }
.set-foot { display: flex; justify-content: flex-end; align-items: center; gap: var(--s4); flex-wrap: wrap; position: sticky; bottom: 0; padding-block: var(--s3) calc(var(--s3) + env(safe-area-inset-bottom, 0px)); background: var(--paper); border-top: 1px solid var(--rule-soft); }

@media (max-width: 720px) {
  .bar-in { gap: var(--s3); flex-wrap: wrap; padding-block: var(--s2) 0; }
  .who { margin-left: auto; }
  .tabs { order: 3; width: 100%; }
  .tab { flex: 1; min-height: 44px; }
}