:root{
  color-scheme:light;
  --bg:#f0f0f0;--card:#fff;--hover:#f5f5f5;
  --border:#d2d2d2;--border-strong:#8a8d90;
  --tp:#151515;--ts:#6a6e73;
  --acc:#06c;--acc-hover:#004080;--acc-bg:#e7f1fa;
  --warn:#795600;--warn-bg:#fdf7e7;--warn-bd:#f4c145;
  --ok:#1e4f18;--ok-bg:#f3faf2;--ok-bd:#3e8635;
  --dg:#c9190b;--dg-text:#7d1007;--dg-bg:#faeae8;
  --info-bd:#73bcf7;
  --mast:#151515;--nav:#212427;--nav-hover:#3c3f42;--nav-current:#4f5255;--nav-text:#e0e0e0;--nav-accent:#73bcf7;
  --radius:3px;--card-radius:4px;
}
*{box-sizing:border-box}
html,body,#app{margin:0;height:100%}
body{background:var(--bg);color:var(--tp);font-size:14px;line-height:1.5;
  font-family:"Red Hat Text","Overpass",system-ui,-apple-system,"Segoe UI","Pretendard","Malgun Gothic",sans-serif}
[hidden]{display:none!important}
h1{font-size:22px;font-weight:400;margin:0}
h2{font-size:16px;font-weight:600;margin:0}
p{margin:0}
:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
main:focus{outline:none}
input,select,textarea{font:inherit;color:var(--tp);background:var(--card);border:1px solid var(--border);
  border-bottom-color:var(--border-strong);border-radius:var(--radius);min-height:36px;padding:0 8px}
input:hover,select:hover,textarea:hover{border-bottom-color:var(--acc)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 1px var(--acc)}
textarea{width:100%;min-height:110px;padding:6px 8px;resize:vertical}
input[type=checkbox]{min-height:0;width:16px;height:16px;accent-color:var(--acc);margin:0;box-shadow:none}
label{display:inline-flex;flex-direction:column;gap:4px;font-size:14px;font-weight:500;color:var(--tp)}
label.check{flex-direction:row;align-items:center;gap:8px;font-weight:400}
button{font:inherit;cursor:pointer;min-height:36px;padding:0 16px;border-radius:var(--radius);
  border:1px solid var(--acc);background:transparent;color:var(--acc);
  display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
button:hover{box-shadow:inset 0 0 0 1px var(--acc);background:var(--card)}
button:disabled{border-color:var(--border);color:var(--ts);background:var(--hover);box-shadow:none;cursor:default}
button.primary{background:var(--acc);border-color:var(--acc);color:#fff}
button.primary:hover{background:var(--acc-hover);border-color:var(--acc-hover);box-shadow:none}
button.primary:disabled{background:var(--border);border-color:var(--border);color:var(--ts)}
button.danger{border-color:var(--dg);color:var(--dg)}
button.danger:hover{background:var(--dg);color:#fff;box-shadow:none}
button[aria-pressed=true]{background:var(--acc-bg);font-weight:600}
a{color:var(--acc)}
a:hover{color:var(--acc-hover)}
.shell{display:flex;flex-direction:column;min-height:100%}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:56px;padding:0 16px 0 24px;
  background:var(--mast);color:#fff;border-bottom:1px solid #000}
.brand{font-weight:600;font-size:18px;letter-spacing:.2px}
.who{display:flex;align-items:center;gap:12px;color:#d2d2d2}
.who button{border-color:transparent;color:#fff;background:transparent}
.who button:hover{background:#3c3f42;box-shadow:none}
.who :focus-visible{outline-color:var(--nav-accent)}
.body{display:flex;flex:1;min-height:0}
nav.menu{width:220px;flex-shrink:0;background:var(--nav);padding:8px 0}
nav.menu a{display:block;padding:8px 16px 8px 20px;color:var(--nav-text);text-decoration:none;border-left:4px solid transparent}
nav.menu a:hover{background:var(--nav-hover);color:#fff}
nav.menu a[aria-current=page]{background:var(--nav-current);color:#fff;font-weight:600;border-left-color:var(--nav-accent)}
nav.menu a.group.open{color:#fff;font-weight:600}
nav.menu a.sub{padding:6px 16px 6px 36px;font-size:13px;color:#c7c7c7}
nav.menu a.sub:hover,nav.menu a.sub[aria-current=page]{color:#fff}
nav.menu :focus-visible{outline-color:var(--nav-accent);outline-offset:-2px}
main{flex:1;min-width:0;padding:24px}
.stack{display:flex;flex-direction:column;gap:16px}
.head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.row{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}
.row.middle{align-items:center}
.grow{flex:1;min-width:200px}
.grow input{width:100%}
.muted{color:var(--ts)}
.small{font-size:13px}
.error{color:var(--dg)}
.panel,.card,section.stack:has(> h2:first-child),main > .stack > form.row{background:var(--card);border:1px solid var(--border);
  border-radius:var(--card-radius);padding:16px;box-shadow:0 1px 2px rgba(3,3,3,.08)}
.panel{display:flex;flex-direction:column;gap:12px}
.panel > h2:first-child,section.stack:has(> h2:first-child) > h2:first-child{margin:-16px -16px 0;padding:12px 16px;
  border-bottom:1px solid var(--border)}
section.stack:has(> h2:first-child) .panel{border:none;box-shadow:none;padding:0;background:transparent}
section.stack:has(> h2:first-child) .scroll{margin:0 -16px;border:none;border-radius:0;box-shadow:none}
section.stack:has(> h2:first-child) .scroll :is(th,td):first-child{padding-left:16px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.card{display:flex;flex-direction:column;gap:10px}
.card .facts{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;margin:0}
.card dt{color:var(--ts)}
.card dd{margin:0}
.badge{display:inline-flex;align-items:center;gap:4px;padding:1px 8px;border-radius:30em;font-size:12px;font-weight:400;
  border:1px solid transparent;white-space:nowrap}
.badge.ok{background:var(--ok-bg);color:var(--ok);border-color:var(--ok-bd)}
.badge.warn{background:var(--warn-bg);color:var(--warn);border-color:var(--warn-bd)}
.badge.fail{background:var(--dg-bg);color:var(--dg-text);border-color:var(--dg)}
.badge.info{background:var(--acc-bg);color:#002952;border-color:var(--info-bd)}
.badge.off{background:var(--bg);color:var(--tp);border-color:var(--border)}
.spinner{width:14px;height:14px;border:2px solid var(--acc-bg);border-top-color:var(--acc);border-radius:50%;
  display:inline-block;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spinner{animation-duration:3s}}
.scroll{overflow-x:auto;background:var(--card);border:1px solid var(--border);border-radius:var(--card-radius);
  box-shadow:0 1px 2px rgba(3,3,3,.08)}
table{width:100%;border-collapse:collapse;font-size:14px}
th{font-weight:600;font-size:13px;color:var(--tp);text-align:left;padding:10px 12px;white-space:nowrap;border-bottom:1px solid var(--border)}
td{padding:6px 12px;vertical-align:middle}
tbody tr{border-top:1px solid var(--border)}
tbody tr:first-child{border-top:none}
tbody tr:hover{background:var(--hover)}
td input:not([type=checkbox]),td select{width:100%;min-width:90px;border-color:transparent;background:transparent;padding:0 6px}
td input:not([type=checkbox]):hover,td select:hover{border-color:var(--border);border-bottom-color:var(--acc)}
td input:not([type=checkbox]):focus,td select:focus{border-color:var(--acc);background:var(--card)}
td input.wide{min-width:280px}
td input[type=date]{min-width:125px}
td .times input[type=time]{width:115px;min-width:0;border-color:var(--border);border-bottom-color:var(--border-strong)}
td.actions{white-space:nowrap}
td.actions button{min-height:30px;padding:0 10px;margin-left:4px}
td.detail{background:#fafafa;padding:16px 24px;box-shadow:inset 3px 0 0 var(--acc)}
tbody tr:hover td.detail{background:#fafafa}
.fields{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px 16px}
.fields label input{width:100%;border-color:var(--border);border-bottom-color:var(--border-strong);background:var(--card)}
.field-value{display:flex;flex-direction:column;gap:3px;font-size:13px;overflow-wrap:anywhere}
.field-value span:first-child{color:var(--ts);font-weight:500}
.pager{display:flex;align-items:center;gap:10px;justify-content:flex-end;color:var(--ts)}
.tabs{display:flex;gap:0;flex-wrap:wrap;border-bottom:1px solid var(--border)}
.tabs button{border:none;border-bottom:3px solid transparent;border-radius:0;color:var(--ts);background:transparent;box-shadow:none}
.tabs button:hover{color:var(--tp);border-bottom-color:var(--border-strong)}
.tabs button[aria-pressed=true]{color:var(--tp);border-bottom-color:var(--acc);background:transparent}
.days{display:flex;gap:8px}
.times{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.chip{display:inline-flex;align-items:center;gap:2px;padding:0 2px 0 8px;border-radius:var(--radius);background:var(--bg);
  color:var(--tp);border:1px solid var(--border);font-size:13px}
.chip button{min-height:22px;padding:0 6px;border:none;background:transparent;color:var(--ts);box-shadow:none}
.chip button:hover{color:var(--tp);background:transparent}
td .times button{min-height:30px;padding:0 10px}
td .times .chip button{min-height:22px;padding:0 6px}
.list{margin:6px 0 0;padding-left:18px}
.results{list-style:none;margin:0;padding:0}
.results li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid var(--border)}
.results li:first-child{border-top:none}
.auth{min-height:100%;display:flex;align-items:center;justify-content:center;padding:16px;
  background:var(--mast)}
.auth button{justify-content:center}
.auth form{width:380px;max-width:100%;padding:24px 32px;gap:16px}
.auth h1{font-size:24px}
.auth label{display:flex}
.auth input{width:100%}
dialog{border:none;border-radius:var(--card-radius);padding:24px;max-width:640px;width:calc(100% - 32px);
  box-shadow:0 8px 16px rgba(3,3,3,.3)}
dialog::backdrop{background:rgba(3,3,3,.62)}
dialog td{overflow-wrap:anywhere}
#toasts{position:fixed;right:24px;top:72px;z-index:50;display:flex;flex-direction:column;
  gap:8px;align-items:flex-end;width:max-content;max-width:calc(100% - 24px)}
.toast{background:var(--card);color:var(--tp);padding:12px 16px;border-radius:var(--card-radius);display:flex;align-items:center;gap:12px;
  border-top:3px solid #3e8635;box-shadow:0 4px 12px rgba(3,3,3,.2)}
.toast.bad{border-top-color:var(--dg);background:var(--dg-bg);color:var(--dg-text)}
.toast button{min-height:28px;padding:0 10px;font-weight:600}
.toast.bad button{border-color:var(--dg);color:var(--dg)}
.drive-frame{width:100%;height:75vh;border:1px solid var(--border);border-radius:var(--card-radius);background:#fff}
@media (max-width:760px){
  .topbar{padding:0 12px}
  .body{flex-direction:column}
  nav.menu{width:auto;display:flex;overflow-x:auto;gap:0;padding:0}
  nav.menu a,nav.menu a.sub{margin:0;white-space:nowrap;padding:10px 14px;border-left:none;border-bottom:3px solid transparent}
  nav.menu a[aria-current=page]{border-bottom-color:var(--nav-accent)}
  main{padding:12px}
  #toasts{right:12px;left:12px;top:auto;bottom:16px;align-items:stretch}
}
.ok-text{color:#3e8635}
code.copy{display:block;padding:8px 10px;background:#f5f5f5;border:1px solid #d2d2d2;border-radius:3px;user-select:all;word-break:break-all}