@layer components{.wrap{padding-inline:var(--gutter);gap:var(--gap);flex-direction:column;padding-block:20px 56px;display:flex}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.between{justify-content:space-between}.stack{flex-direction:column;gap:12px;display:flex}.cols{flex-wrap:wrap;align-items:flex-start;gap:24px;display:flex}.main{gap:var(--gap);flex-direction:column;flex:999 520px;min-width:0;display:flex}.side{gap:var(--gap);flex-direction:column;flex:300px;min-width:0;display:flex}.grid{grid-template-columns:repeat(auto-fit, minmax(var(--min,150px), 1fr));gap:12px;display:grid}}
@layer components{.banner{border:2px solid var(--edge);border-radius:var(--r-banner);flex-direction:column;gap:8px;padding:12px 14px;display:flex}.banner.ok{background:var(--accent-soft)}.banner.warn{background:var(--alert-soft)}.banner.info{background:var(--yellow);color:var(--on-yellow)}.banner .actions{flex-wrap:wrap;gap:8px;display:flex}.pro .banner{border:1px solid var(--line);border-radius:10px}.pro .banner.warn{border-color:var(--alert)}.pro .banner.ok{border-color:var(--accent)}.pro .banner.info{border-color:var(--yellow-edge)}}
@layer components{.btn{min-height:var(--tap);border:2px solid var(--edge);border-radius:var(--r-btn);background:var(--surface);color:var(--ink);box-shadow:var(--hard);cursor:pointer;font:inherit;align-items:center;gap:8px;padding:0 16px;font-size:14px;font-weight:700;text-decoration:none;display:inline-flex}.btn:active{box-shadow:1px 1px 0 var(--shadow);transform:translate(2px,2px)}.btn.primary{background:var(--accent);color:var(--on-accent)}.btn.warn{color:var(--alert)}.btn.on{background:var(--yellow);color:var(--on-yellow);box-shadow:1px 1px 0 var(--shadow);transform:translate(2px,2px)}.btn.ghost{box-shadow:none;color:var(--muted);background:0 0;border-color:#0000;font-weight:600}.btn.sm{min-height:var(--tap-sm);box-shadow:var(--hard-sm);padding:0 10px;font-size:13px}.btn.full{justify-content:center;width:100%}.btn[disabled],.btn[aria-disabled=true]{opacity:.5;cursor:not-allowed}.btn[disabled]:active{box-shadow:var(--hard);transform:none}.pro .btn{border:1px solid var(--line);box-shadow:none;border-radius:8px;font-weight:600}.pro .btn:hover:not([disabled]){border-color:var(--muted)}.pro .btn:active{box-shadow:none;transform:none}.pro .btn.primary{border-color:var(--accent)}.pro .btn.on{background:var(--ink);color:var(--bg);border-color:var(--ink);box-shadow:none;transform:none}.pro .btn.warn{border-color:var(--line)}.pro .btn.ghost{border-color:#0000}.pro .btn.sm{box-shadow:none}.linkbtn{color:var(--accent);cursor:pointer;font:inherit;background:0 0;border:0;padding:0;text-decoration:underline}}
@layer components{.card{background:var(--surface);border:2px solid var(--edge);border-radius:var(--r-card);box-shadow:var(--hard-lg);flex-direction:column;gap:12px;min-width:0;padding:18px;display:flex}.card.inv{background:var(--ink);color:var(--bg);box-shadow:5px 5px 0 var(--yellow)}.card.inv .sub{color:var(--bg);opacity:.75}.kv{justify-content:space-between;gap:12px;font-size:14px;display:flex}.kv>span:first-child{color:var(--muted)}.kv>span:last-child{text-align:right}.card.inv .kv>span:first-child{color:var(--bg);opacity:.7}.pro .card{border:1px solid var(--line);box-shadow:var(--lift);border-radius:12px}.pro .card.inv{box-shadow:var(--lift);border-color:var(--ink)}}
@layer components{.chip,.st{border:2px solid var(--edge);border-radius:var(--r-chip);font-size:var(--fs-chip);white-space:nowrap;align-items:center;gap:6px;padding:2px 8px;font-weight:700;display:inline-flex}.chip.ok{background:var(--accent-soft)}.chip.wait{background:var(--yellow);color:var(--on-yellow)}.chip.no{background:var(--alert-soft);color:var(--alert)}.chip.ute,.st-ute{background:var(--ute);color:var(--on-ute);border-color:var(--ute-edge)}.st-plan{background:var(--surface)}.st-done{background:var(--done)}.st-inne{background:var(--accent-soft)}.st-miss{background:var(--alert-soft);color:var(--alert)}.st-vikar{background:var(--accent);color:var(--on-accent)}.st-ny{background:var(--yellow);color:var(--on-yellow)}.st-off{color:var(--muted);background:0 0;border-style:dashed}.st-late{background:var(--alert-soft);color:var(--alert);border-style:dashed}.pro .chip,.pro .st{border-width:1px}.pro .st-plan{border-color:var(--line)}}
@layer components{.field{flex-direction:column;gap:6px;min-width:0;display:flex}.field>label,.field-head{font-weight:700}.field-head{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.field-head a,.field-head .linkbtn{font-size:var(--fs-sub);font-weight:400}.field input,.field textarea,.field select{width:100%;min-height:var(--field-h);border:2px solid var(--edge);border-radius:var(--r-field);background:var(--surface);color:var(--ink);font:inherit;padding:0 12px}.field textarea{resize:vertical;padding:10px 12px}.field select{appearance:none;height:var(--tap);min-height:var(--tap);cursor:pointer;text-overflow:ellipsis;white-space:nowrap;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='none' stroke='%2355615B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;background-size:18px;padding:0 38px 0 12px;line-height:1.2;overflow:hidden}.field select:hover{border-color:var(--muted)}.field select:focus-visible{outline:3px solid var(--accent);outline-offset:1px}.field [aria-invalid=true]{border-color:var(--alert)}.field-hint{font-size:var(--fs-sub);color:var(--muted)}.field-err{font-size:var(--fs-sub);color:var(--alert);font-weight:600}.field input.code{letter-spacing:.25em;text-align:center;font-variant-numeric:tabular-nums;font-size:22px}.check{min-height:var(--tap);cursor:pointer;align-items:center;gap:10px;display:flex}.check input{width:22px;height:22px;accent-color:var(--accent);flex:none;margin:0}.pro .field input,.pro .field textarea,.pro .field select{border:1px solid var(--line);border-radius:8px}.pro .field input:focus,.pro .field textarea:focus,.pro .field select:focus{border-color:var(--accent)}.pro .field [aria-invalid=true]{border-color:var(--alert)}}
@layer components{.ico{background:0 0;flex:none;display:block}.ico svg{width:100%;height:100%;display:block}.mico{flex:none;display:block}}
@layer components{.kpis{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;display:grid}.kpi{gap:6px}.kpi-l{color:var(--muted);font-size:13px;font-weight:600}.kpi-n{font-size:var(--fs-kpi);letter-spacing:-.01em;font-variant-numeric:tabular-nums;font-weight:700;line-height:1.1}.kpi-n small{color:var(--muted);font-size:15px;font-weight:600}.card.kpi.alert,.pro .card.kpi.alert{border-color:var(--alert);background:var(--alert-soft)}.kpi.alert .kpi-n{color:var(--alert)}.kpi.okay .kpi-n{color:var(--accent)}.meter{border-radius:var(--r-chip);background:var(--soft);height:8px;overflow:hidden}.meter span{border-radius:var(--r-chip);background:var(--accent);height:100%;display:block}.meter.warn span{background:var(--alert)}}
@layer components{.count{border-radius:var(--r-chip);background:var(--alert);min-width:22px;height:22px;color:var(--surface);font-variant-numeric:tabular-nums;justify-content:center;align-items:center;padding:0 6px;font-size:12px;font-weight:700;display:inline-flex}.empty{border:2px dashed var(--edge);border-radius:var(--r-banner);color:var(--muted);padding:16px}.pro .empty{border:1px dashed var(--line)}}
@layer components{.avatar{border:2px solid var(--edge);width:32px;height:32px;color:var(--ink);background:var(--soft) center / cover no-repeat;border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex}.nchip{color:var(--ink);background:var(--soft);white-space:nowrap;border-radius:6px;padding:3px 10px;font-size:13px;font-weight:700;display:inline-block}.pro .avatar{border-width:1px;border-color:var(--line)}}
@layer components{dialog.ovl{background:var(--bg);width:min(1080px,100% - 32px);max-width:none;max-height:calc(100dvh - 2*clamp(12px,4vh,48px));color:var(--ink);overscroll-behavior:contain;border:0;border-radius:16px;margin:clamp(12px,4vh,48px) auto auto;padding:0;overflow:auto;box-shadow:0 24px 64px #15201b47}dialog.ovl::backdrop{background:#15201b73}dialog.ovl[open]{animation:.22s cubic-bezier(.2,.8,.2,1) ovlIn}dialog.ovl[open]::backdrop{animation:.18s ease-out ovlFade}.ovl-body{flex-direction:column;gap:16px;padding:24px;display:flex}.ovl-x{float:right;z-index:2;border:1px solid var(--line);background:var(--surface);width:48px;height:48px;color:var(--ink);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;margin:14px 14px -62px 0;display:inline-flex;position:sticky;top:14px;box-shadow:0 2px 8px #15201b1f}.ovl-x:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}.ovl-x svg{width:20px;height:20px}html:has(dialog.ovl[open]){overflow:hidden}@media (max-width:560px){dialog.ovl{width:calc(100% - 16px);max-height:calc(100dvh - 16px);margin-top:8px}.ovl-body{padding:18px 16px}}@keyframes ovlFade{0%{opacity:0}}@keyframes ovlIn{0%{opacity:0;transform:translateY(16px)scale(.985)}}}
@layer components{.pill{min-height:var(--tap);border:2px solid var(--edge);border-radius:var(--r-chip);background:var(--surface);color:var(--ink);box-shadow:var(--hard);cursor:pointer;font:inherit;align-items:center;gap:8px;padding:4px 14px 4px 6px;font-size:14px;font-weight:600;display:inline-flex}.pill.bare{padding-left:14px}.pill.on{background:var(--yellow);color:var(--on-yellow);box-shadow:1px 1px 0 var(--shadow);transform:translate(2px,2px)}.pill .sub{color:inherit;opacity:.75}.pills{flex-wrap:wrap;gap:10px;display:flex}.pro .pill{border:1px solid var(--line);box-shadow:none}.pro .pill.on{background:var(--accent-soft);color:var(--ink);border-color:var(--accent);box-shadow:none;transform:none}}
@layer components{.seg{background:var(--soft);border-radius:var(--r-btn);gap:2px;padding:3px;display:inline-flex}.seg button{min-height:34px;color:var(--muted);font:600 14px/1 var(--body);cursor:pointer;background:0 0;border:0;border-radius:8px;padding:0 14px}.seg button[aria-pressed=true]{background:var(--surface);color:var(--ink);box-shadow:0 1px 2px #15201b1f}.seg.sm button{min-height:30px;padding:0 10px;font-size:13px}.seg.wrap{flex-wrap:wrap;height:auto}.seg-n{color:var(--muted);margin-left:2px;font-size:12px}}
@layer components{.top{background:var(--surface);border-bottom:2px solid var(--edge);padding-inline:var(--gutter);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding-block:10px;display:flex}.pro .top,.top.pro{border-bottom:1px solid var(--line)}.brand{color:inherit;align-items:center;gap:10px;text-decoration:none;display:flex}.brand-logo{flex:none;width:auto;height:34px;display:block}.brand-sep{background:var(--line);align-self:stretch;width:1px}.brand .sub{line-height:1.25}.eshell{align-items:flex-start;gap:24px;display:flex}.econtent{gap:var(--gap);flex-direction:column;flex:1 1 0;min-width:0;display:flex}.rail{top:calc(12px + env(safe-area-inset-top,0px));width:var(--rail-w);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--lift);flex-direction:column;flex:none;gap:4px;padding:8px 6px;display:flex;position:sticky}.rail-i{border-radius:var(--r-btn);min-height:60px;color:var(--muted);font:600 11px/1.2 var(--body);text-align:center;cursor:pointer;background:0 0;border:0;flex-direction:column;align-items:center;gap:4px;padding:10px 4px 8px;text-decoration:none;display:flex;position:relative}.rail-i svg{width:24px;height:24px}.rail-i:hover{background:var(--soft);color:var(--ink)}.rail-i[aria-current=page]{background:var(--accent-soft);color:var(--accent)}.rail-i .count{border:2px solid var(--surface);min-width:18px;height:18px;padding:0 5px;font-size:11px;position:absolute;top:5px;right:10px}.rail-i[aria-current=page] .count{border-color:var(--accent-soft)}.rail-more,.rail-sheet,.rail-sheet-bg{display:none}@media (max-width:720px){.rail.rail-e,.rail.rail-r{z-index:30;width:auto;padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px));border:0;border-top:1px solid var(--line);border-radius:0;flex-direction:row;justify-content:center;gap:2px;position:fixed;inset:auto 0 0;box-shadow:0 -2px 12px #15201b0f}.rail.rail-r{z-index:20;gap:4px;padding-inline:8px}.rail.rail-e .rail-i{flex:1 1 0;max-width:120px;min-height:56px;font-size:12px}.rail.rail-r .rail-i{flex:1 1 0;max-width:140px;min-height:56px;font-size:12px}.rail.rail-e .rx{display:none}.rail.rail-e .rail-more{display:flex}.rail .rail-i .count{left:calc(50% + 6px);right:auto}.rail.rail-r.has-tm{flex-wrap:wrap;row-gap:6px}.rail-sheet-bg{z-index:28;background:#15201b59;display:block;position:fixed;inset:0}.rail-sheet{left:8px;right:8px;bottom:calc(76px + env(safe-area-inset-bottom,0px));z-index:29;background:var(--surface);border:1px solid var(--line);border-radius:16px;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:10px;display:grid;position:fixed;box-shadow:0 12px 32px #15201b33}.rail-sheet .rail-i{background:var(--soft);min-height:68px;color:var(--ink);border-radius:12px;font-size:12px}.rail-sheet .rail-i[aria-current=page]{background:var(--accent-soft);color:var(--accent)}.rail-sheet .rail-i .count{border-color:var(--soft);top:6px;left:calc(50% + 6px);right:auto}.has-tabbar .wrap{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}.has-tabbar .wrap:has(.rail-r.has-tm){padding-bottom:calc(150px + env(safe-area-inset-bottom,0px))}}@media (max-width:560px){.top{gap:8px;padding-block:8px}.brand-logo{height:26px}.brand .sub{font-size:12px}}@media print{.rail,.top{display:none!important}}}
@layer components{.toast{left:50%;bottom:calc(16px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);border:2px solid var(--edge);border-radius:var(--r-btn);z-index:70;max-width:calc(100% - 32px);padding:10px 16px;font-weight:600;position:fixed;transform:translate(-50%)}.toast:empty{display:none}@media (max-width:720px){body:has(.has-tabbar) .toast{bottom:calc(84px + env(safe-area-inset-bottom,0px))}}}
