:root{
  --ink:#3d3230;--ink-soft:#7a6a66;--paper:#faf6f1;--card:#fff;--line:#e8ded6;
  --accent:#c96f6f;--accent-deep:#a85454;--ok:#5e8c61;--ok-bg:#eaf3ea;
  --warn:#b7791f;--warn-bg:#fdf3e3;--danger:#b54b4b;--danger-bg:#fbeaea;
  --chip:#f3ece5;--radius:14px;font-size:16px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:"Zen Kaku Gothic New",sans-serif;
  background:radial-gradient(1200px 500px at 85% -10%, #f2e6e0 0%, transparent 60%),var(--paper);
  color:var(--ink);min-height:100vh;
}
header.app{
  display:flex;align-items:center;gap:14px;padding:14px 22px;border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.75);backdrop-filter:blur(6px);position:sticky;top:0;z-index:50;
}
.logo{font-family:"Zen Maru Gothic";font-weight:900;font-size:1.15rem;letter-spacing:.06em}
.logo em{color:var(--accent);font-style:normal}
.user{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--ink-soft)}
.user .avatar{width:30px;height:30px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:700}
.user .logout{color:var(--ink-soft);font-size:.78rem;margin-left:6px}
nav.tabs{display:flex;gap:6px;padding:14px 22px 0;flex-wrap:wrap}
nav.tabs a{
  font-family:"Zen Maru Gothic";font-weight:700;font-size:.95rem;text-decoration:none;
  border:1px solid var(--line);background:var(--card);color:var(--ink-soft);
  padding:12px 20px;border-radius:12px 12px 0 0;border-bottom:none;transition:.15s;
}
nav.tabs a:hover{color:var(--ink)}
nav.tabs a.active{
  background:linear-gradient(180deg,#fff,#fdf9f5);color:var(--ink);
  border-color:var(--accent);margin-bottom:-1px;box-shadow:0 -3px 0 var(--accent) inset;
}
main{max-width:1080px;margin:0 auto;padding:26px 22px 80px}
h1.page{font-family:"Zen Maru Gothic";font-weight:900;font-size:1.5rem;margin-bottom:4px;letter-spacing:.04em}
.page-sub{color:var(--ink-soft);font-size:.85rem;margin-bottom:22px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin-bottom:18px;box-shadow:0 1px 3px rgba(61,50,48,.05)}
.card h2{font-family:"Zen Maru Gothic";font-size:1.05rem;font-weight:700;display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.badge{font-size:.72rem;border-radius:99px;padding:3px 10px;font-weight:700}
.badge.warn{background:var(--warn-bg);color:var(--warn)}
.badge.danger{background:var(--danger-bg);color:var(--danger)}
.badge.ok{background:var(--ok-bg);color:var(--ok)}
.badge.info{background:var(--chip);color:var(--ink-soft)}
table{width:100%;border-collapse:collapse;font-size:.9rem}
th{text-align:left;font-size:.74rem;color:var(--ink-soft);font-weight:500;padding:8px 10px;border-bottom:1px solid var(--line);letter-spacing:.05em;white-space:nowrap}
td{padding:12px 10px;border-bottom:1px solid #f3ede7;vertical-align:middle}
tr:last-child td{border-bottom:none}
tr.clickable{cursor:pointer;transition:.12s}
tr.clickable:hover{background:#fdf7f3}
td .name{font-weight:700}
td .small,.small{font-size:.76rem;color:var(--ink-soft)}
a{color:var(--accent-deep)}
td a.name{text-decoration:none;color:var(--ink)}
td a.name:hover{color:var(--accent-deep)}
.btn{
  font-family:"Zen Maru Gothic";font-weight:700;font-size:.88rem;border:none;border-radius:10px;
  padding:10px 18px;cursor:pointer;transition:.15s;text-decoration:none;display:inline-block;
}
.btn.primary{background:var(--accent);color:#fff}
.btn.primary:hover{background:var(--accent-deep)}
.btn.ghost{background:#fff;border:1.5px solid var(--line);color:var(--ink)}
.btn.ghost:hover{border-color:var(--accent);color:var(--accent-deep)}
.btn.danger-link{background:#fff;border:1.5px solid var(--line);color:var(--danger)}
.btn.big{font-size:1rem;padding:14px 26px;border-radius:12px}
.btn:disabled{opacity:.35;cursor:not-allowed}
.summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:22px}
.summary .stat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px}
.stat .num{font-family:"Zen Maru Gothic";font-weight:900;font-size:1.9rem;line-height:1.1}
.stat .label{font-size:.78rem;color:var(--ink-soft)}
.stat.alert{border-color:#efcaca;background:linear-gradient(180deg,#fff,#fdf4f4)}
.stat.alert .num{color:var(--danger)}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;align-items:center}
.filters input[type=search],.filters input[type=text]{
  flex:1;min-width:220px;padding:11px 14px;border:1.5px solid var(--line);border-radius:10px;
  font-size:.95rem;font-family:inherit;background:#fff;
}
.filters input:focus{outline:none;border-color:var(--accent)}
.chipbtn{
  font-size:.8rem;border:1.5px solid var(--line);background:#fff;border-radius:99px;
  padding:7px 14px;cursor:pointer;color:var(--ink-soft);font-family:inherit;text-decoration:none;
}
.chipbtn.on{background:var(--ink);border-color:var(--ink);color:#fff}
.detail-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
@media(max-width:760px){.detail-grid{grid-template-columns:1fr}}
dl.kv{display:grid;grid-template-columns:8.5em 1fr;row-gap:10px;font-size:.92rem}
dl.kv dt{color:var(--ink-soft);font-size:.8rem;padding-top:2px}
dl.kv dd{font-weight:500}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
ul.timeline{list-style:none;font-size:.88rem}
ul.timeline li{display:flex;gap:12px;padding:10px 0;border-bottom:1px dashed var(--line);align-items:baseline}
ul.timeline li:last-child{border-bottom:none}
ul.timeline .date{font-family:"Zen Maru Gothic";font-weight:700;white-space:nowrap;font-size:.8rem;color:var(--ink-soft)}
.note{font-size:.8rem;color:var(--ink-soft);background:var(--chip);border-radius:10px;padding:10px 14px;margin-top:12px;line-height:1.7}
.checkrow{display:flex;align-items:center;gap:10px}
input[type=checkbox]{width:20px;height:20px;accent-color:var(--accent);cursor:pointer}
.flash{border-radius:12px;padding:13px 18px;margin-bottom:16px;font-size:.9rem;font-weight:500}
.flash.success{background:var(--ok-bg);color:var(--ok)}
.flash.error{background:var(--danger-bg);color:var(--danger)}
.empty{color:var(--ink-soft);font-size:.85rem;padding:14px 4px}
form.inline{display:inline}
input[type=text],input[type=date],input[type=number],select,textarea{
  padding:10px 12px;border:1.5px solid var(--line);border-radius:10px;font-size:.92rem;font-family:inherit;background:#fff;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent)}
.formgrid{display:grid;grid-template-columns:8.5em 1fr;gap:10px 14px;align-items:center;max-width:560px}
.formgrid label{font-size:.8rem;color:var(--ink-soft)}
.login-wrap{max-width:420px;margin:80px auto;text-align:center}
.login-wrap .card{padding:40px 32px}
.login-wrap h1{font-family:"Zen Maru Gothic";font-weight:900;font-size:1.4rem;margin-bottom:8px}
.login-wrap p{color:var(--ink-soft);font-size:.85rem;margin-bottom:24px}
