:root{
  --primary:#0065BD;--primary-light:#D4E3F2;--bg-page:#F2F2F2;--bg-card:#FFFFFF;
  --text-primary:#1A1A1A;--text-secondary:#595959;--border:#CCCCCC;
  --danger:#CF1B1B;--danger-bg:#FDEAEA;--danger-border:#F5A5A5;
  --warning:#B06000;--warning-bg:#FEF3E2;--positive:#006834;--negative:#CF1B1B;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'Hiragino Kaku Gothic ProN','Meiryo','Noto Sans JP',sans-serif;background:var(--bg-page);color:var(--text-primary);font-size:14px;line-height:1.6;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);}
.page{max-width:1100px;margin:0 auto;padding:20px 20px 40px;}

/* -- header -- */
.header{display:flex;justify-content:space-between;align-items:flex-end;border-bottom:2px solid var(--primary);padding-bottom:12px;margin-bottom:20px;}
.header-left{display:flex;align-items:center;gap:12px;}
.back-btn{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--primary);border:1px solid var(--primary);padding:4px 10px;cursor:pointer;background:none;white-space:nowrap;text-decoration:none;}
.back-btn:hover{background:var(--primary-light);}
.header-title{font-size:20px;font-weight:700;}
.header-sub{font-size:12px;color:var(--text-secondary);margin-top:2px;}
.header-meta{font-size:12px;color:var(--text-secondary);text-align:right;}

/* -- tab nav -- */
.tab-bar{display:flex;border-bottom:2px solid var(--primary);margin-bottom:20px;flex-wrap:wrap;}
.tab-btn{padding:8px 18px;font-size:13px;font-weight:700;border:none;background:none;cursor:pointer;color:var(--text-secondary);border-bottom:3px solid transparent;margin-bottom:-2px;white-space:nowrap;}
.tab-btn.active{color:var(--primary);border-bottom-color:var(--primary);background:#fff;}
.tab-btn:hover:not(.active){background:#F0F0F0;}
.screen{display:none;}
.screen.active{display:block;}

/* -- section label -- */
.section-label{font-size:11px;font-weight:700;color:var(--primary);letter-spacing:.05em;border-left:3px solid var(--primary);padding-left:8px;margin-bottom:12px;margin-top:20px;}
.section-label:first-child{margin-top:0;}

/* -- alert box -- */
.alert-box{background:var(--danger-bg);border:1px solid var(--danger-border);border-left:4px solid var(--danger);padding:12px 16px;margin-bottom:20px;}
.alert-header{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--danger);margin-bottom:10px;}
.alert-item{display:flex;align-items:baseline;gap:10px;font-size:12px;color:#7A1111;padding:5px 0;border-top:1px solid rgba(207,27,27,.15);}
.alert-tag{font-size:10px;font-weight:700;padding:2px 7px;white-space:nowrap;flex-shrink:0;}
.tag-logi{background:#FFD6D6;color:#7A1111;}
.tag-quo{background:#D4E3F2;color:#003A75;}

/* -- KPI card -- */
.kpi-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px;}
.kpi-grid-5{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:20px;}
.kpi-card{background:var(--bg-card);border:1px solid var(--border);border-top:3px solid var(--primary);padding:12px 14px;}
.kpi-card.warn{border-top-color:var(--warning);}
.kpi-card.danger{border-top-color:var(--danger);}
.kpi-card.danger .kpi-value{color:var(--danger);}
.kpi-card.warn .kpi-value{color:var(--warning);}
.kpi-label{font-size:10px;color:var(--text-secondary);margin-bottom:5px;}
.kpi-value{font-size:24px;font-weight:700;line-height:1;}
.kpi-unit{font-size:12px;font-weight:400;color:var(--text-secondary);margin-left:2px;}
.kpi-diff{font-size:10px;margin-top:4px;}
.diff-up{color:var(--positive);}
.diff-down{color:var(--negative);}
.diff-na{color:var(--text-secondary);}

/* -- card -- */
.card{background:var(--bg-card);border:1px solid var(--border);padding:14px 16px;margin-bottom:14px;}
.card-title{font-size:11px;font-weight:700;color:var(--text-secondary);margin-bottom:12px;padding-bottom:6px;border-bottom:1px solid var(--border);}

/* -- grid -- */
.g2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px;}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-bottom:14px;}

/* -- company header -- */
.co-header{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;padding:8px 12px;margin-bottom:12px;}
.co-header.logi{background:#0065BD;color:#fff;}
.co-header.quo{background:#1A5C99;color:#fff;}
.co-header small{font-size:11px;font-weight:400;opacity:.85;margin-left:4px;}

/* -- mini metrics -- */
.mini3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px;}
.mini-card{background:#F7F7F7;border:1px solid #E4E4E4;padding:10px 12px;text-align:center;}
.mini-label{font-size:10px;color:var(--text-secondary);margin-bottom:4px;}
.mini-value{font-size:20px;font-weight:700;line-height:1.1;}
.mini-sub{font-size:10px;color:var(--text-secondary);}
.mini-link{font-size:10px;color:var(--primary);font-weight:700;cursor:pointer;border-bottom:1px solid var(--primary);text-decoration:none;}

/* -- progress -- */
.prog-row{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.prog-label{font-size:11px;color:var(--text-secondary);width:96px;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.prog-bar{flex:1;height:8px;background:#E8E8E8;overflow:hidden;}
.prog-fill{height:100%;}
.prog-val{font-size:11px;font-weight:700;width:36px;text-align:right;flex-shrink:0;}

/* -- table -- */
.tbl{width:100%;border-collapse:collapse;font-size:12px;}
.tbl th{background:#F0F0F0;color:var(--text-secondary);font-weight:700;font-size:11px;padding:7px 10px;text-align:left;border-bottom:2px solid var(--border);}
.tbl td{padding:7px 10px;border-bottom:1px solid #EBEBEB;vertical-align:middle;}
.tbl tr:last-child td{border-bottom:none;}
.tbl tr:hover td{background:#F9F9F9;}
.tbl .r{text-align:right;}
.tbl .c{text-align:center;}

/* -- badge -- */
.badge{display:inline-block;font-size:10px;font-weight:700;padding:2px 7px;}
.bg{background:#E1F5EE;color:#085041;}
.br{background:#FDEAEA;color:#7A1111;}
.bo{background:#FEF3E2;color:#7A2E00;}
.bs{background:#EBEBEB;color:#595959;}
.bb{background:#D4E3F2;color:#003A75;}

/* -- staff row -- */
.staff-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #EBEBEB;cursor:pointer;}
.staff-row:last-child{border-bottom:none;}
.staff-row:hover{background:#F9F9F9;}
.s-avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0;}
.s-info{flex:1;}
.s-name{font-size:13px;font-weight:700;}
.s-sub{font-size:11px;color:var(--text-secondary);}
.s-time{font-size:11px;color:var(--text-secondary);text-align:right;min-width:60px;}

/* -- detail panel -- */
.detail-panel{background:var(--bg-card);border:1px solid var(--border);border-left:4px solid var(--primary);padding:16px;margin-bottom:14px;display:none;}
.detail-panel.open{display:block;}
.d-header{display:flex;align-items:center;gap:12px;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--border);}
.d-avatar{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#fff;flex-shrink:0;}
.d-name{font-size:16px;font-weight:700;}
.d-meta{font-size:11px;color:var(--text-secondary);}
.stat4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px;}
.stat-box{background:#F7F7F7;border:1px solid #E4E4E4;padding:8px 10px;text-align:center;}
.stat-label{font-size:10px;color:var(--text-secondary);}
.stat-value{font-size:18px;font-weight:700;line-height:1.2;}
.stat-unit{font-size:10px;color:var(--text-secondary);}
.close-btn{margin-left:auto;background:none;border:1px solid var(--border);padding:3px 10px;font-size:11px;cursor:pointer;color:var(--text-secondary);}
.close-btn:hover{background:#F0F0F0;}

/* -- checklist -- */
.check-item{display:flex;align-items:flex-start;gap:10px;padding:7px 0;border-bottom:1px solid #EBEBEB;font-size:12px;}
.check-item:last-child{border-bottom:none;}
.check-icon{font-size:14px;flex-shrink:0;margin-top:1px;}
.check-label{flex:1;}
.check-val{font-size:11px;color:var(--text-secondary);min-width:60px;text-align:right;}

/* -- legend / chart note -- */
.legend-row{display:flex;gap:16px;margin-bottom:10px;flex-wrap:wrap;}
.legend-item{display:flex;align-items:center;gap:5px;font-size:11px;color:var(--text-secondary);}
.leg-sq{width:12px;height:12px;flex-shrink:0;}
.chart-note{font-size:11px;color:var(--text-secondary);margin-top:6px;}

/* -- footer -- */
.footer{font-size:11px;color:var(--text-secondary);border-top:1px solid var(--border);padding-top:10px;text-align:right;margin-top:20px;}

/* -- nav bar -- */
.nav-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border);}
.nav-link{font-size:12px;color:var(--primary);border:1px solid var(--primary);padding:4px 12px;text-decoration:none;white-space:nowrap;background:var(--bg-card);}
.nav-link:hover{background:var(--primary-light);}
.nav-link.active{background:var(--primary);color:#fff;}

/* -- capacity bar -- */
.cap-bar-wrap{margin-bottom:14px;}
.cap-label-row{display:flex;justify-content:space-between;font-size:12px;margin-bottom:4px;}
.cap-bar-lg{height:20px;background:#E8E8E8;overflow:hidden;}
.cap-fill{height:100%;}

@media(max-width:700px){
  .kpi-grid-4,.kpi-grid-5{grid-template-columns:repeat(2,1fr);}
  .g2,.g3{grid-template-columns:1fr;}
}
