:root{
  --paper:#ffffff; --ink:#000000; --ink2:#3d3d3d; --muted:#6e6e6e; --rule:#bdbdbd; --hair:#e3e3e3;
  --zh:#009ee0; --zhdeep:#0070a8; --zhtint:#e6f6fd; --ok:#1d7a3e; --oktint:#e7f4ec; --warn:#b42318; --warntint:#fdecea; --field:#f6fbfe;
  --font:'Archivo',Arial,Helvetica,sans-serif;
  color-scheme:light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){--paper:#121416;--ink:#f2f2f2;--ink2:#cfcfcf;--muted:#9a9a9a;--rule:#4a4f54;--hair:#2a2e32;--zh:#38b6ee;--zhdeep:#7fd0f5;--zhtint:#11303f;--ok:#5cc489;--oktint:#13301f;--warn:#ff8a7a;--warntint:#3a1714;--field:#1a1f23;color-scheme:dark}
}
:root[data-theme="dark"]{--paper:#121416;--ink:#f2f2f2;--ink2:#cfcfcf;--muted:#9a9a9a;--rule:#4a4f54;--hair:#2a2e32;--zh:#38b6ee;--zhdeep:#7fd0f5;--zhtint:#11303f;--ok:#5cc489;--oktint:#13301f;--warn:#ff8a7a;--warntint:#3a1714;--field:#1a1f23;color-scheme:dark}
*,*::before,*::after{box-sizing:inherit}
html{height:100%;scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;min-height:100%;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.45}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--paper)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--zh);outline-offset:2px}
img{max-width:100%}
.lion{filter:none}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .lion{filter:invert(1)}}
:root[data-theme="dark"] .lion{filter:invert(1)}

/* Header like the official form */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--paper);border-bottom:1px solid var(--rule);display:flex;align-items:center;gap:14px;padding:10px 20px}
.brand{display:flex;align-items:flex-end;gap:12px;text-decoration:none;color:inherit}
.brand img{height:62px;width:auto}
.brand .kz{font-size:12px;line-height:1.25;color:var(--ink2)}
.brand .wd{display:flex;align-items:center;gap:7px;font-weight:900;font-stretch:108%;font-size:26px;line-height:1;letter-spacing:-.01em;margin:2px 0}
.brand .wd::before{content:"";width:20px;height:20px;flex:0 0 20px;background:linear-gradient(to top right,#009ee0 50%,#ffffff 50%);box-shadow:inset 0 0 0 1px #009ee0}
.who{margin-left:auto;text-align:right;font-size:13px;color:var(--ink2)}
.who b{display:block;color:var(--ink);font-size:15px}
.linkbtn{background:none;border:0;padding:0;color:var(--zhdeep);text-decoration:underline;cursor:pointer;font-size:13px}

.shell{display:grid;grid-template-columns:230px 1fr;min-height:calc(100vh - 77px)}
nav.side{border-right:1px solid var(--hair);padding:22px 0}
nav.side button{display:block;width:100%;text-align:left;background:none;border:0;padding:11px 22px;font-size:15px;cursor:pointer;color:var(--ink2);border-left:4px solid transparent}
nav.side button[aria-current="page"]{color:var(--ink);font-weight:800;border-left-color:var(--zh);background:var(--zhtint)}
main{padding:28px 32px 60px;max-width:1100px;width:100%}
@media (max-width:820px){
  .shell{grid-template-columns:1fr}
  nav.side{position:fixed;left:0;right:0;bottom:0;z-index:6;display:flex;overflow-x:auto;border-right:0;border-top:1px solid var(--rule);background:var(--paper);padding:0 0 env(safe-area-inset-bottom,0px)}
  nav.side button{flex:1 0 auto;width:auto;text-align:center;border-left:0;border-top:3px solid transparent;padding:10px 12px;font-size:13px}
  nav.side button[aria-current="page"]{border-top-color:var(--zh)}
  main{padding:20px 16px 110px}
  .brand img{height:42px}.brand .wd{font-size:22px}
  .top{padding:8px 14px}
}
h1{font-weight:900;font-stretch:108%;font-size:30px;line-height:1.1;margin:0 0 6px}
h2{font-weight:800;font-size:19px;margin:28px 0 10px}
p.lead{color:var(--ink2);margin:0 0 22px;max-width:65ch}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.spacer{flex:1}
.btn{border:2px solid var(--ink);background:var(--ink);color:var(--paper);padding:10px 18px;font-weight:700;cursor:pointer;border-radius:2px}
.btn.alt{background:transparent;color:var(--ink)}
.btn.zh{background:var(--zh);border-color:var(--zh);color:#fff}
.btn.small{padding:6px 12px;font-size:14px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.tag{display:inline-block;font-size:12.5px;font-weight:700;padding:2px 8px;border-radius:2px;white-space:nowrap}
.tag.draft{background:var(--zhtint);color:var(--zhdeep)}
.tag.done{background:var(--oktint);color:var(--ok)}
.tag.pend{background:var(--warntint);color:var(--warn)}
.note{border-left:4px solid var(--zh);background:var(--zhtint);padding:12px 16px;margin:14px 0;max-width:75ch}
.note.warn{border-color:var(--warn);background:var(--warntint)}
.note.ok{border-color:var(--ok);background:var(--oktint)}

/* Tables */
.tablewrap{overflow-x:auto;border-top:2px solid var(--ink)}
table{border-collapse:collapse;width:100%;font-size:14.5px}
th{text-align:left;font-weight:700;padding:9px 10px;border-bottom:1px solid var(--rule);white-space:nowrap}
td{padding:9px 10px;border-bottom:1px solid var(--hair);vertical-align:top}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
tr.click{cursor:pointer}tr.click:hover td{background:var(--zhtint)}
tr.sum td{font-weight:800;border-top:1px solid var(--ink)}

/* The paper form */
.paper{max-width:860px}
.paper .title{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin:8px 0 18px}
.paper .title h1{font-size:38px;margin:0}
.datebox{display:flex;align-items:center;gap:8px;border-bottom:1.5px solid var(--ink);border-left:1.5px solid var(--ink);background:var(--field);padding:4px 10px 3px}
.datebox .wdname{font-size:18px;font-weight:800;min-width:1.5em}
.datebox input{border:0;background:transparent;font-size:16px;padding:3px 0}
.datebox input:disabled{color:var(--ink)}
.paper .nr{font-size:28px;letter-spacing:.06em;color:var(--ink2);font-variant-numeric:tabular-nums}
.f{display:grid;grid-template-columns:200px 1fr;column-gap:14px;align-items:end;margin:0 0 12px}
.f>label,.f>.lbl{text-align:right;font-size:14.5px;color:var(--ink2);padding-bottom:7px}
.f .line{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:end}
.u{display:flex;align-items:end;gap:8px;flex:1 1 140px;min-width:0}
.u>span{font-size:14px;color:var(--ink2);padding-bottom:7px;white-space:nowrap}
.u input,.u select,.u textarea{flex:1;min-width:0;width:100%;border:0;border-bottom:1.5px solid var(--ink);border-left:1.5px solid var(--ink);background:var(--field);padding:7px 8px 5px;border-radius:0;font-size:16px}
.u textarea{resize:vertical;min-height:64px}
.u input[readonly],.u input:disabled,.u select:disabled,.u textarea:disabled{background:transparent;color:var(--ink)}
.u.calc input{background:transparent;font-weight:800}
.u.narrow{flex:0 0 auto}
.u.narrow input,.u.narrow select{flex:0 0 118px;width:118px}
.u.calc input{flex:0 0 178px;width:178px}
.f.top{align-items:start}.f.top>.lbl{padding-top:8px}
.check{display:flex;gap:10px;align-items:center;font-size:15px;margin:6px 0}
.check input{width:20px;height:20px;accent-color:var(--zh)}
.hint{font-size:13px;color:var(--muted);margin:2px 0 0}
.formfoot{border-top:2px solid var(--ink);margin-top:22px;padding-top:16px}
.signbox{display:flex;gap:24px;flex-wrap:wrap;align-items:flex-end}
.signbox img{height:70px;background:#fff;border-bottom:1.5px solid var(--ink)}
.stamp{display:inline-block;border:2px solid var(--ok);color:var(--ok);padding:6px 12px;font-weight:800;transform:rotate(-2deg)}
@media (max-width:620px){
  .f{grid-template-columns:1fr}
  .f>label,.f>.lbl{text-align:left;padding-bottom:3px}
  .paper .title h1{font-size:30px}
}

/* Cards for login */
.login{max-width:440px;margin:48px auto;padding:0 18px}
.login .brand{margin-bottom:26px}
.fld{display:block;margin:0 0 14px}
.fld span{display:block;font-size:14px;color:var(--ink2);margin-bottom:4px}
.fld input,.fld select{width:100%;border:1.5px solid var(--rule);background:var(--paper);padding:10px 12px;border-radius:2px}
.fld input:focus,.fld select:focus{border-color:var(--zh)}
.demo{margin-top:30px;border-top:1px solid var(--rule);padding-top:16px}
.demo button{display:block;width:100%;text-align:left;background:none;border:1px solid var(--hair);padding:10px 12px;margin:6px 0;cursor:pointer}
.demo button small{display:block;color:var(--muted)}
.demo .linkbtn{display:inline;width:auto;border:0;padding:0;margin:0}

.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px 22px}
fieldset{border:0;border-top:2px solid var(--ink);padding:14px 0 6px;margin:20px 0 0}
legend{font-weight:800;padding-right:10px}
.big{font-size:34px;font-weight:900;font-variant-numeric:tabular-nums;font-stretch:106%}
.amountbox{border:3px solid var(--zh);padding:16px 20px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;margin:18px 0}

/* Modal */
dialog{border:0;padding:0;max-width:560px;max-height:calc(100vh - 24px);overflow:auto;width:calc(100% - 28px);background:var(--paper);color:var(--ink)}
dialog::backdrop{background:rgba(0,0,0,.45)}
.dlg{padding:22px}
.dlg canvas{width:100%;height:150px;background:#fff;border:1.5px dashed var(--rule);touch-action:none;display:block}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--ink);color:var(--paper);padding:12px 18px;max-width:min(560px,92vw);z-index:20;font-size:15px}
@media (max-width:820px){.toast{bottom:calc(80px + env(safe-area-inset-bottom,0px))}}
@media (prefers-reduced-motion:no-preference){.toast{animation:pop .22s ease-out}@keyframes pop{from{opacity:0;transform:translate(-50%,8px)}}}
.muted{color:var(--muted)}
.right{text-align:right}

.toast.warn{background:var(--warn);color:#fff}
body.busy{cursor:progress}
body.busy::after{content:"";position:fixed;left:0;right:0;top:env(safe-area-inset-top,0px);height:3px;background:var(--zh);z-index:30;animation:bar 1s linear infinite}
@keyframes bar{from{transform:scaleX(.1);transform-origin:left}to{transform:scaleX(1);transform-origin:left}}
.filters{margin-bottom:14px;align-items:flex-end}.filters .fld{margin:0;min-width:180px}
.hint.indent{margin:-4px 0 12px 214px}
@media (max-width:620px){.hint.indent{margin-left:0}}
.daytype{padding-bottom:7px}
.check.tight{margin:2px 0}
.btn.danger{border-color:var(--warn);color:var(--warn)}
.version{margin-top:28px}

/* Mehrfachauswahl, Logo */
.selbar{border:1.5px solid var(--rule);background:var(--field);padding:10px 12px;margin:0 0 12px;gap:8px}
td.selc,th.selc{width:34px;padding-right:0}
td.selc input,th.selc input{width:19px;height:19px;accent-color:var(--zh);cursor:pointer}
tr.selrow td{background:var(--zhtint)}
.paper .title .cologo{max-height:56px;max-width:190px;margin-left:auto;align-self:center;background:#fff;padding:2px}
.cologo.big{max-height:90px;max-width:300px;background:#fff;padding:6px;border:1px solid var(--hair)}
.logobox{gap:14px;margin-bottom:6px}

/* 1.3: Cockpit, Live-Status, Abrechnung */
.fld.inline{flex-direction:row;align-items:center;gap:8px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:8px 0 18px}
.kpi{border:1.5px solid var(--rule);padding:12px 14px;display:flex;flex-direction:column;gap:2px;background:var(--paper,#fff)}
.kpi span{font-size:.82rem;color:var(--muted)}.kpi b{font-size:1.6rem;line-height:1.15;font-weight:800}.kpi b small{font-size:.8rem;font-weight:600}.kpi>small{color:var(--muted);font-size:.8rem}
.kpi.warnk{border-color:#c98a00}.okc{color:#16803c}
.pbar{height:12px;background:#e6e6e6;border-radius:6px;overflow:hidden;margin:4px 0}.pbar i{display:block;height:100%;background:var(--zh)}
.billtop{display:grid;grid-template-columns:minmax(260px,1fr) minmax(300px,1.3fr);gap:14px;align-items:stretch;margin-bottom:12px}
@media (max-width:820px){.billtop{grid-template-columns:1fr}}
.billtop .amountbox{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin:0}
.amountbox .col{display:flex;flex-direction:column;gap:8px;align-items:stretch}.amountbox .sub{font-size:.82rem;opacity:.85;margin-top:4px}
.amountbox.closed{outline:3px solid #16803c;outline-offset:-3px}
.seasonbox{border:1.5px solid var(--rule);padding:12px 14px}.seasonbox h3{margin:0 0 8px;font-size:1rem}
.kv{display:flex;justify-content:space-between;gap:10px;margin:4px 0;flex-wrap:wrap}.kv.small{font-size:.82rem}
.ok{color:#16803c}.warnc{color:#a86b00}.bad{color:#b42318}
.mstrip{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.mchip{border:1.5px solid var(--rule);background:#fff;padding:5px 8px;display:flex;flex-direction:column;align-items:center;min-width:64px;cursor:pointer;font:inherit;font-size:.78rem;color:#111}
.mchip b{font-size:.74rem}.mchip.closed{background:#e3f4e8;border-color:#16803c}.mchip.open{background:#fff6dc;border-color:#c98a00}.mchip.none,.mchip.future{opacity:.6}
.mchip.cur{box-shadow:0 0 0 2px var(--zh)}
.chart{border:1.5px solid var(--rule);padding:26px 12px 6px;overflow-x:auto}
.bars{display:flex;gap:10px;align-items:flex-end;height:190px;min-width:420px}
.bcol{flex:1;display:flex;flex-direction:column;height:100%}.bgrp{flex:1;display:flex;gap:3px;align-items:flex-end;justify-content:center}
.bar{flex:1;max-width:38px;min-height:2px;position:relative;background:var(--zh)}.bar.s1{background:#9aa5b1}
.bar span{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);font-size:.7rem;white-space:nowrap;padding-bottom:2px;color:var(--ink,#111)}
.blab{text-align:center;font-size:.78rem;padding-top:4px;color:var(--muted)}
.legend{display:flex;gap:14px;font-size:.8rem;padding-top:6px}.legend i{display:inline-block;width:12px;height:12px;margin-right:5px;vertical-align:-1px;background:var(--zh)}.legend i.s1{background:#9aa5b1}
.livegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:8px}
.livecard{border:2px solid #b42318;background:#fdecea;padding:8px 10px;display:flex;flex-direction:column;gap:6px}
.livecard.on{border-color:#16803c;background:#e3f4e8}
.lamp{width:14px;height:14px;border-radius:50%;background:#d92d20;box-shadow:0 0 0 3px #f6c9c4;flex:none;margin-top:5px}
.livecard.on .lamp{background:#17a34a;box-shadow:0 0 0 3px #b9e6c8,0 0 10px #17a34a}
.lc-main{flex:1;display:flex;flex-direction:column;min-width:0}.lc-main b{font-size:1.05rem;line-height:1.2}.lc-nick{font-size:.78rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lc-state{font-size:.78rem;color:#333}
.livecard .btn{width:100%}.btn.go{background:#16803c;border-color:#16803c;color:#fff}
.livecount{font-size:1.05rem}.livestrip{display:flex;gap:6px;flex-wrap:wrap}.lchip{padding:3px 8px;font-size:.8rem;border:1.5px solid #16803c;background:#e3f4e8}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;background:#d92d20}.dot.on{background:#17a34a}
.small{font-size:.8rem}
@media (prefers-color-scheme:dark){.mchip,.kpi{background:transparent;color:inherit}.livecard{background:#3a1512}.livecard.on{background:#0f2e1a}.lc-state{color:inherit}.mchip.closed{background:#0f2e1a}.mchip.open{background:#3a2c08}}

.lc-top{display:flex;gap:8px;align-items:flex-start}
.lc-who{display:flex;flex-direction:column;align-items:center;max-width:64px;text-align:center}.lc-who small{font-size:.66rem;line-height:1.15;margin-top:2px;overflow:hidden;text-overflow:ellipsis;max-width:64px}
.avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:none;border:2px solid #fff;box-shadow:0 0 0 1px #9aa5b1;background:#dde3ea}
.avatar.ini{display:inline-flex;align-items:center;justify-content:center;font-weight:800;font-size:.85rem;color:#33414f}
.avatar.sm{width:32px;height:32px;font-size:.72rem}.avatar.lg{width:72px;height:72px;font-size:1.3rem}
.uname{display:flex;gap:8px;align-items:center}.photorow{gap:12px;align-items:center;margin-bottom:4px}
.livecard .btn.small{padding:6px 8px;min-height:34px}
.pauschbox{border:1.5px solid var(--rule);padding:10px 14px;margin-bottom:12px}.pauschbox h3{margin:0 0 6px;font-size:1rem}
@media (max-width:420px){.livegrid{grid-template-columns:1fr 1fr}}
@media (prefers-color-scheme:dark){.lc-state{color:inherit}.avatar.ini{color:#111}}
.lc-main b{white-space:nowrap;font-size:1rem}
.lc-who .avatar{width:34px;height:34px;font-size:.72rem}.lc-who{max-width:56px}.lc-who small{max-width:56px;white-space:nowrap}
.livecard .lc-top{gap:6px}
.livegrid{grid-template-columns:repeat(auto-fill,minmax(min(165px,100%),1fr))}
@media (max-width:420px){.livegrid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.livecard{min-width:0}.lc-main b{overflow:hidden;text-overflow:ellipsis}
.livecard{padding:7px 8px}.livecard.on .lc-main b{font-size:.9rem;letter-spacing:-.01em}
.lc-who{max-width:50px}.lc-who small{white-space:normal;max-width:50px;font-size:.62rem;word-break:break-word}
.lc-who .avatar{width:32px;height:32px}

#t24,#t24off{margin-left:6px;padding:4px 8px;min-height:30px;font-size:.8rem}

/* 1.6: Mobile-Formular und Navigation */
.tbtn{display:flex;gap:6px;align-items:end;flex:1;min-width:0}.tbtn input{flex:1;min-width:0}
#t24,#t24off{margin-left:0}
.pch{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:6px}.inl{font-size:.9rem;display:flex;gap:6px;align-items:center}
.inl select{padding:4px 8px;border:1.5px solid var(--rule);background:var(--field)}
@media (max-width:620px){
  .top{padding:6px 12px;gap:8px}
  .brand{gap:8px;align-items:center}.brand img{height:34px}.brand .kz{display:none}.brand .wd{font-size:18px}.brand .wd::before{width:15px;height:15px;flex-basis:15px}
  .who{font-size:11px;line-height:1.3}.who b{font-size:13px}.linkbtn{font-size:12px}
  main{padding:14px 12px 100px}
  h1{font-size:24px}
  .paper .title{gap:8px 10px;margin:4px 0 12px;align-items:center}
  .paper .title h1{font-size:22px;width:100%}
  .datebox{flex:1 1 auto}.paper .nr{font-size:17px}
  .paper .title .cologo{max-height:34px;max-width:110px}
  .f{margin:0 0 12px;row-gap:3px}
  .f>label,.f>.lbl{font-size:13px;padding-bottom:0;font-weight:700;color:var(--ink)}
  .f .line{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 10px;align-items:end}
  .u{flex-direction:column;align-items:stretch;gap:2px;min-width:0}
  .u>span{font-size:12px;padding-bottom:0;white-space:normal}
  .u:not(.narrow){grid-column:1/-1}
  .u.narrow input,.u.narrow select,.u.calc input{width:100%;flex:1 1 auto}
  .u input,.u select,.u textarea{padding:9px 8px 7px}
  .u.calc input{font-size:15px}
  .tbtn{width:100%}
  .hint.indent{font-size:12px}
  .check{align-items:flex-start}
  fieldset{padding:8px 0 0}
  .formfoot .row{flex-direction:column;align-items:stretch}.formfoot .row .spacer{display:none}
  .formfoot .btn{width:100%}
  .signbox{gap:12px}.signbox img{height:56px;max-width:100%}
  .dlg{padding:14px}
  nav.side:not(.many) button{flex:1 1 0;padding:9px 4px;font-size:12px;white-space:normal;line-height:1.2}
}
@media (max-width:620px){
  .f.ro{display:grid;grid-template-columns:minmax(0,46%) minmax(0,1fr);align-items:baseline;column-gap:10px;margin:0 0 2px;padding:5px 0;border-bottom:1px solid var(--hair)}
  .f.ro>.lbl{font-weight:400;color:var(--ink2);font-size:12.5px}
  .f.ro .line{display:flex;gap:10px;align-items:baseline}
  .f.ro .u{flex-direction:row;align-items:baseline;gap:4px;grid-column:auto}
  .f.ro .u>span{font-size:12px}
  .f.ro .u input{border:0;background:transparent;padding:0;font-weight:700;font-size:14.5px}
}
@media (max-width:620px){.f.ro .line{flex-wrap:nowrap}.f.ro .u{flex:1 1 auto;min-width:0}.f.ro .u.narrow{flex:0 0 auto}.f.ro .u.narrow input{width:3.2em;flex:0 0 3.2em}.f.ro .u input{text-overflow:ellipsis}}

.nrman{display:flex;flex-direction:column;gap:2px;margin-left:auto}.nrman span{font-size:12px;color:var(--ink2)}
.nrman input{width:150px;font-size:18px;letter-spacing:.04em;border:0;border-bottom:1.5px solid var(--ink);border-left:1.5px solid var(--ink);background:var(--field);padding:5px 8px}
.fnprev{font-family:ui-monospace,Menlo,Consolas,monospace;margin:-4px 0 10px}code{background:var(--field);padding:1px 4px;font-size:.85em;margin-right:2px}
@media (max-width:620px){.nrman{margin-left:0}.nrman input{width:120px;font-size:16px}}
.nbin{width:130px;padding:6px 8px;border:0;border-bottom:1.5px solid var(--ink);border-left:1.5px solid var(--ink);background:var(--field);font-size:15px}
@media (max-width:620px){.nbin{width:96px}}
[hidden]{display:none!important}

/* 1.9: Pikett */
.tabs{display:flex;gap:4px;border-bottom:2px solid var(--ink);margin:0 0 14px}.tabs button{background:none;border:0;padding:8px 14px;font:inherit;font-weight:700;color:var(--ink2);cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-2px}
.tabs button.on{color:var(--ink);border-bottom-color:var(--zh)}
.lc-pik{font-size:.72rem;color:var(--ink2);border-top:1px dashed rgba(0,0,0,.15);padding-top:4px}
.pushbox{margin-bottom:12px}
.swcard{border:1.5px solid var(--rule);padding:10px 12px;margin:0 0 8px;display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;justify-content:space-between}
.swcard .row{gap:8px}
.pikgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;margin-bottom:8px}
.pikcard{border:1.5px solid var(--rule);padding:8px 10px;display:flex;flex-direction:column;gap:4px}.pikcard.none{opacity:.65}
.pikwho{display:inline-flex;align-items:center;gap:8px}
.piklist{border:1.5px solid var(--rule);margin-top:8px}
.pikwk{background:var(--field);font-weight:800;font-size:.85rem;padding:6px 10px;border-top:1px solid var(--rule)}
.pikday{display:flex;align-items:center;gap:10px;padding:6px 10px;border-top:1px solid var(--hair);min-height:46px}
.pikday .pd{width:5.4em;flex:none;font-variant-numeric:tabular-nums}.pikday .pikwho{flex:1;min-width:0}
.pikday.mine{background:var(--zhtint)}.pikday.today .pd{font-weight:800}
.swpick{display:flex;flex-direction:column;gap:4px;max-height:44vh;overflow:auto;border:1.5px solid var(--rule);padding:6px 10px;margin-bottom:10px}
.swpick .check{display:flex;align-items:center;gap:10px;padding:4px 0}
.autofill{border:1.5px solid var(--rule);padding:8px 12px;margin:0 0 14px}.autofill summary{cursor:pointer;font-weight:800}
.pikplan select{max-width:150px;padding:4px 6px;border:1px solid var(--rule);background:var(--field)}
.pikplan tr.curwk td{background:var(--zhtint)}.nowrap{white-space:nowrap}
@media (max-width:620px){.pikday{flex-wrap:wrap}.pikday .btn{margin-left:auto}.swcard{flex-direction:column;align-items:stretch}}

.timp{border:1.5px solid var(--rule);padding:10px 12px;margin-bottom:10px}.timp .grid2{margin:6px 0}
table.small td,table.small th{font-size:.85rem;padding:4px 8px}
#hform .fld{margin:0}

.perms{display:flex;flex-direction:column;gap:2px;margin-top:6px}.perms .check{font-size:.82rem}
tr.subrow td{background:var(--field);font-size:.88rem}tr.sum td{font-weight:800;border-top:2px solid var(--ink)}

.chips{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}.chip{display:inline-flex;align-items:center;gap:6px;background:var(--zhtint);border:1px solid var(--rule);border-radius:20px;padding:4px 6px 4px 12px;font-size:.9rem}
.chip button{border:0;background:transparent;font-size:1.1rem;cursor:pointer;line-height:1;color:var(--ink)}
#mTxt,#mSub,#mAdd{width:100%;box-sizing:border-box;font:inherit;padding:8px;border:1.5px solid var(--rule);background:var(--field)}#mTxt{min-height:150px}