:root{
      --bg:#f5f7fb;
      --card:#ffffff;
      --line:#dbe3ef;
      --text:#1b2430;
      --muted:#617087;
      --accent:#2563eb;
      --accent-2:#1d4ed8;
      --warn:#b45309;
      --danger:#b91c1c;
      --ok:#166534;
      --shadow:0 10px 28px rgba(15,23,42,.08);
      --radius:16px;
      --heat0:#ffffff;
      --heat1:#dbeafe;
      --heat2:#93c5fd;
      --heat3:#2563eb;
      --heat4:#dc2626;
    }
    *{box-sizing:border-box}
    html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,"Hiragino Sans","Yu Gothic UI","Segoe UI",sans-serif}
    body{line-height:1.55}
    .wrap{max-width:1600px;margin:0 auto;padding:18px}
    .topbar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}
    h1{font-size:1.55rem;margin:0}
    h2{font-size:1.08rem;margin:.1rem 0 .7rem}
    h3{font-size:.98rem;margin:.1rem 0 .7rem}
    .subtitle{color:var(--muted);font-size:.95rem}
    .layout{display:grid;grid-template-columns:400px 1fr;gap:16px;align-items:start}
    .card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
    .panel{padding:16px}
    label{display:block;font-weight:700;font-size:.92rem;margin:10px 0 6px}
    input[type="text"],input[type="date"],input[type="time"],select,textarea,input[type="number"]{
      width:100%;padding:10px 12px;border:1px solid #cfd8e3;border-radius:12px;font:inherit;background:#fff;color:var(--text)
    }
    textarea{min-height:84px;resize:vertical}
    .small{font-size:.85rem;color:var(--muted)}
    .grid2,.grid3,.grid4{display:grid;gap:10px}
    .grid2{grid-template-columns:repeat(2,minmax(0,1fr))}
    .grid3{grid-template-columns:repeat(3,minmax(0,1fr))}
    .grid4{grid-template-columns:repeat(4,minmax(0,1fr))}
    .checkgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px;padding:10px;border:1px solid var(--line);border-radius:12px;background:#fbfcfe}
    .checkgrid label{font-weight:500;margin:0;display:flex;gap:8px;align-items:flex-start}
    .inline-actions,.btnrow,.tabbar{display:flex;gap:8px;flex-wrap:wrap}
    button{
      border:1px solid #c7d2e1;background:#fff;color:var(--text);padding:10px 12px;border-radius:12px;font:inherit;font-weight:700;cursor:pointer
    }
    button.primary{background:var(--accent);border-color:var(--accent);color:#fff}
    button.primary:hover{background:var(--accent-2)}
    button.warn{border-color:#f6d7aa;background:#fff7ed;color:var(--warn)}
    button.danger{border-color:#fecaca;background:#fef2f2;color:var(--danger)}
    button.ghost{background:#f8fbff}
    button.active-tab{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}
    .section{padding:0 0 4px;border-top:1px solid #eef2f7;margin-top:14px}
    .section:first-child{border-top:0;margin-top:0}
    .notice{padding:12px 14px;border-radius:14px;background:#f8fbff;border:1px solid #d7e6ff;color:#294b7a;font-size:.92rem}
    .warnbox{padding:12px 14px;border-radius:14px;background:#fff8eb;border:1px solid #f8ddb1;color:#8a5206;font-size:.92rem}
    .dangerbox{padding:12px 14px;border-radius:14px;background:#fff1f2;border:1px solid #fecdd3;color:#9f1239;font-size:.92rem}
    .sidebar-sticky{position:sticky;top:14px}
    .stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}
    .stat{padding:12px;border:1px solid var(--line);border-radius:14px;background:#fbfcff}
    .stat .num{font-size:1.45rem;font-weight:800}
    .stat .lab{font-size:.84rem;color:var(--muted)}
    .list{display:flex;flex-direction:column;gap:10px;max-height:64vh;overflow:auto;padding-right:4px}
    .record{
      border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff;cursor:pointer;
    }
    .record.active{border-color:#99b9ff;box-shadow:0 0 0 3px rgba(37,99,235,.12)}
    .record-head{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
    .record-title{font-weight:800}
    .record-meta{font-size:.83rem;color:var(--muted)}
    .chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
    .chip{font-size:.76rem;padding:4px 8px;border-radius:999px;background:#eef4ff;color:#274b84;border:1px solid #d6e4ff}
    .chip.warn{background:#fff6e8;border-color:#f4d7a5;color:#91560a}
    .chip.danger{background:#fff1f2;border-color:#fecdd3;color:#9f1239}
    .result-grid{display:grid;grid-template-columns:1.2fr .9fr;gap:16px}
    .box{border:1px solid var(--line);border-radius:14px;padding:14px;background:#fcfdff}
    .rank{display:grid;gap:8px}
    .rank-item{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff}
    .rank-top{display:flex;justify-content:space-between;gap:8px;align-items:center}
    .rank-name{font-weight:800}
    .progress{height:8px;background:#e9eef7;border-radius:999px;overflow:hidden;margin-top:8px}
    .bar{height:100%;background:linear-gradient(90deg,#60a5fa,#2563eb)}
    .muted{color:var(--muted)}
    .hidden{display:none!important}
    .empty{padding:24px;border:1px dashed #cfd8e3;border-radius:14px;color:var(--muted);text-align:center;background:#fbfcfe}
    .tabpanel{display:none}
    .tabpanel.active{display:block}
    table{width:100%;border-collapse:collapse}
    th,td{padding:8px;border-bottom:1px solid #eef2f7;text-align:left;vertical-align:top}
    th{font-size:.88rem;color:var(--muted)}
    .footer-note{margin-top:14px;font-size:.84rem;color:var(--muted)}
    .history-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:16px}
    .chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
    .canvasbox{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fff}
    canvas{width:100%;height:260px;display:block}
    .history-list{max-height:460px;overflow:auto;border:1px solid var(--line);border-radius:12px}
    .mini-row{padding:10px 12px;border-bottom:1px solid #eef2f7}
    .mini-row:last-child{border-bottom:0}
    .heat-legend{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:.83rem;color:var(--muted)}
    .heat-legend span.sw{display:inline-block;width:18px;height:18px;border-radius:6px;border:1px solid #cfd8e3}
    .heat-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px}
    .week-grid{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%}
    .week-grid th,.week-grid td{border-right:1px solid #eef2f7;border-bottom:1px solid #eef2f7;padding:0}
    .week-grid th.sticky{position:sticky;left:0;background:#fff;z-index:2;padding:6px 8px;min-width:74px}
    .week-grid thead th{position:sticky;top:0;background:#fff;z-index:3;padding:8px;min-width:120px}
    .week-grid td.timecell{position:sticky;left:0;background:#fff;z-index:1;padding:6px 8px;font-size:.82rem;color:var(--muted)}
    .slot{
      width:120px;min-height:28px;padding:4px 6px;cursor:pointer;
      display:flex;align-items:center;justify-content:center;font-size:.75rem;text-align:center
    }
    .level0{background:var(--heat0)}
    .level1{background:var(--heat1)}
    .level2{background:var(--heat2)}
    .level3{background:var(--heat3);color:#fff}
    .level4{background:var(--heat4);color:#fff}
    .week-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
    .pill{display:inline-block;padding:3px 8px;border-radius:999px;background:#eef2ff;border:1px solid #d9e1ff;font-size:.76rem}

    .month-report{margin-top:16px}
    .month-report textarea{min-height:260px}
    .slot-tools{display:flex;gap:8px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:10px}
    .slot-note{font-size:.84rem;color:var(--muted)}
    .kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
    .callout{padding:10px 12px;border-radius:12px;background:#f8fafc;border:1px solid var(--line);font-size:.9rem}
    @media (max-width:1240px){
      .layout{grid-template-columns:1fr}
      .sidebar-sticky{position:static}
      .list{max-height:none}
      .result-grid,.history-layout,.chart-grid{grid-template-columns:1fr}
    }
    @media (max-width:760px){
      .grid2,.grid3,.grid4,.checkgrid,.week-summary{grid-template-columns:1fr}
      .wrap{padding:12px}
    }
    @media print{
      body{background:#fff}
      .topbar,.sidebar-sticky,.hide-print,.tabbar{display:none!important}
      .layout{display:block}
      .card{box-shadow:none;border:none}
      .panel{padding:0}
      .section{break-inside:avoid}
      button{display:none!important}
      .tabpanel{display:block!important}
    }