:host { display: block; }
.dw{--bg:#faf9f5;--side:#f3f1ea;--card:#ffffff;--sand:#eeebe2;--sand2:#e5e1d5;--line:#e3dfd3;--line2:#efece4;--ink:#141413;--ink2:#3d3c38;--mute:#6b6a64;--ok:#2a6b3a;--okt:#276b3f;--bad:#e0566e;--badt:#a8304a;--flk:#b8760a;--flkt:#8a5600;--skp:#8e8c84;--skpt:#5e5d59;--onfill:#ffffff;--shadow:0 1px 2px rgba(20,20,19,.06),0 2px 8px rgba(20,20,19,.04);--tip:0 10px 30px rgba(20,20,19,.16),0 0 0 1px #e3dfd3;--chrome:#ebe8df;
font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:var(--ink);font-size:13.5px;line-height:1.5;-webkit-font-smoothing:antialiased;font-variant-ligatures:no-common-ligatures;font-variant-numeric:tabular-nums}
.dw-dark{--bg:#262624;--side:#1f1e1d;--card:#30302e;--sand:#3a3a37;--sand2:#45443f;--line:#3f3e3a;--line2:#393935;--ink:#faf9f5;--ink2:#e6e4dc;--mute:#b4b2a8;--ok:#7fd08f;--okt:#86d39a;--bad:#d24a6a;--badt:#f08aa0;--flk:#e0a23a;--flkt:#ecb965;--skp:#7d7b74;--skpt:#b0aea5;--onfill:#1f1e1d;--shadow:0 1px 2px rgba(0,0,0,.3);--tip:0 10px 30px rgba(0,0,0,.5),0 0 0 1px #3f3e3a;--chrome:#1a1918}
.dw button{font:inherit;color:inherit}
.serif{font-family:"Source Serif 4",Georgia,serif}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:11.5px}
.brand{font-family:"Space Grotesk",Inter,sans-serif;font-weight:600;letter-spacing:-.03em}
.ic{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.fi{width:13px;height:13px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;color:var(--mute)}
.g{width:16px;height:16px;flex:none;display:block}
.gs{width:13px;height:13px;flex:none;display:block}
.meta{font-size:12px;color:var(--mute)}
.fact{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--mute);white-space:nowrap}
.facts{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px}
.card{background:var(--card);border-radius:18px;box-shadow:var(--shadow)}
.bar{display:flex;border-radius:999px;overflow:hidden;background:var(--sand)}
.bar i{display:block;height:100%}
.t-ok{color:var(--okt)}.t-bad{color:var(--badt)}.t-flk{color:var(--flkt)}.t-skp{color:var(--skpt)}.t-sep{color:var(--mute)}
.side-btn{display:flex;align-items:center;gap:10px;width:100%;padding:7px 10px;border:0;border-radius:9px;background:none;cursor:pointer;text-align:left;font-size:13px;color:var(--ink2)}
.side-btn:hover{background:var(--sand)}
.side-btn .ic{color:var(--mute)}
.side-on{background:var(--sand2);color:var(--ink);font-weight:600}
.side-on:hover{background:var(--sand2)}
.tok{display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 10px;border-radius:999px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line);font-size:12.5px;font-weight:500;color:var(--ink2)}
.lede{margin:12px 0 0;font-family:"Source Serif 4",Georgia,serif;font-size:16px;color:var(--ink2)}
.ptitle{font-family:"Source Serif 4",Georgia,serif;font-size:32px;font-weight:500;letter-spacing:-.02em;line-height:1.15}
.bar2{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:center;margin:22px 0 14px}
.ddw{position:relative;display:inline-flex}
button.tok{border:0;cursor:pointer;font-family:inherit}
.ddm{position:absolute;top:30px;left:0;z-index:21;min-width:180px;padding:5px;border-radius:12px;background:var(--card);box-shadow:0 10px 30px rgba(20,20,19,.14),0 0 0 1px var(--line);display:flex;flex-direction:column}
.ddi{display:flex;align-items:center;gap:8px;border:0;background:none;border-radius:7px;padding:6px 8px;font:inherit;font-size:12.5px;color:var(--ink2);cursor:pointer;text-align:left}
.ddi:hover{background:var(--sand)}
.ddi.on{color:var(--ink);font-weight:600}
.ddi .ddc{width:14px;display:inline-flex}
.seg .segn{color:var(--mute);font-weight:400;margin-left:2px}
.seg .seg-off{opacity:.45;cursor:default}
.srch{margin-left:auto;display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border-radius:999px;background:var(--sand);color:var(--mute);font-size:12px;flex:0 1 150px;min-width:110px;white-space:nowrap;overflow:hidden}
.grp+.grp{border-top:1px solid var(--line)}
.frow2{display:grid;grid-template-columns:14px 16px minmax(0,1fr) 200px 70px;gap:12px;align-items:center;width:100%;padding:13px 20px;border:0;background:none;cursor:pointer;text-align:left;font:inherit;color:inherit}
.frow2:hover,.trow2:hover{background:color-mix(in srgb,var(--sand) 55%,transparent)}
.frow2:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.fcw{display:inline-flex;color:var(--mute);transition:transform .15s}.fcw.on{transform:rotate(90deg)}
.fcw .ic{width:14px;height:14px}
.t1{display:block;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.t1.strong{font-weight:500}
.t2{display:flex;flex-wrap:wrap;gap:2px 12px;margin-top:3px}
.frb{display:block}
.rt{font-size:12px;color:var(--mute);margin-top:5px;display:flex;gap:8px;flex-wrap:wrap}.rt b{font-weight:500}.rt .f{color:var(--badt)}.rt .k{color:var(--flkt)}
.fdur{text-align:right;color:var(--mute);font-size:12.5px}
.sub{border-top:1px solid var(--line)}
.trow2{display:grid;grid-template-columns:16px minmax(0,1fr) 64px;gap:12px;align-items:center;padding:10px 20px 10px 46px;cursor:pointer}
.trow2+.trow2{border-top:1px solid var(--line2)}
.trow2 .num{text-align:right;font-size:12.5px}.trow2 .num.mute{color:var(--mute)}
.num{font-variant-numeric:tabular-nums}
.legend{display:flex;gap:10px 22px;flex-wrap:wrap;margin-top:14px}
.legend>span{display:flex;gap:8px;align-items:baseline}
.legend .n,.cmpn .n{font-family:"Source Serif 4",Georgia,serif;font-size:24px;font-weight:500;line-height:1.1}
.legend .l,.cmpn .l{font-size:12px;color:var(--mute)}
.legend .bad .n,.legend .bad .l,.cmpn .bad .n,.cmpn .bad .l{color:var(--badt)}
.legend .flk .n,.legend .flk .l,.cmpn .flk .n,.cmpn .flk .l{color:var(--flkt)}
.cmpn .ok .n,.cmpn .ok .l{color:var(--okt)}
.cmpn .z .n{color:var(--mute);opacity:.55}
.cmpt{display:block;width:100%;padding:16px 22px;border:1px solid transparent;cursor:pointer;text-align:left;font:inherit;color:inherit}
.cmpt:hover{border-color:color-mix(in srgb,var(--ink) 20%,var(--line))}
.cmpt:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.cmpn{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 28px}
.cmpn>span{display:flex;gap:8px;align-items:baseline}
.cmpgo{margin-left:auto;display:inline!important;font-size:13px;color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:color-mix(in srgb,currentColor 30%,transparent);transition:text-decoration-color .15s}.cmpt:hover .cmpgo,.cmpgo:hover{text-decoration-color:currentColor}
@media (max-width:760px){.frow2{grid-template-columns:14px 16px minmax(0,1fr) auto;padding:12px 14px}.trow2{padding:10px 14px 10px 30px;grid-template-columns:16px minmax(0,1fr) auto}.srch{margin-left:0;flex:1 1 100%}.cmpgo{margin-left:0}}
.hcol{flex:1;border:0;background:none;padding:0;cursor:pointer}
.hcol:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}
.cdot{position:absolute;width:9px;height:9px;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 2px var(--card);pointer-events:none}
.ln{display:inline-block;width:14px;height:3px;border-radius:2px}
.ov2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 28px;align-items:stretch}
.ovc{display:flex;flex-direction:column}
.ovc{min-width:0}
.ov2 .frow{padding:13px 20px;gap:16px}
.ov2 .frow>div:not(.bar)>div:first-child,.ov2 .frow>span>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ov2 .card{flex:1}
.ov2 .rt{font-size:11.5px}
@media (max-width:960px){.ov2{grid-template-columns:minmax(0,1fr)}}
.blist{display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:16px;align-items:center;padding:13px 20px;border-top:1px solid var(--line2)}
.card>.blist:first-child,.card>sc-for>.blist:first-child{border-top:0}
.bname{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:500;min-width:0}
.bname span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bname .fi{color:var(--mute);flex:none}
.bres{display:block}
.sec-h{display:flex;align-items:baseline;gap:10px;margin:30px 0 10px}
.sec-h .t{font-family:"Source Serif 4",Georgia,serif;font-size:19px;font-weight:500}
.run-row{display:grid;grid-template-columns:16px 104px minmax(0,1fr) 220px 76px 16px;gap:12px;align-items:center;width:100%;padding:13px 18px;border:0;border-top:1px solid var(--line2);background:none;cursor:pointer;text-align:left}
.run-row:first-child{border-top:0}
.run-row:hover{background:var(--side)}
.run-row:hover .chev{color:var(--ink)}
.run-row:focus-visible{outline:2px solid var(--ink);outline-offset:-2px;border-radius:12px}
.chev{color:var(--mute)}
.when{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.tbl{width:100%;border-collapse:collapse;min-width:760px}
.th{font-size:12px;font-weight:500;color:var(--mute);text-align:left;padding:11px 14px;border-bottom:1px solid var(--line)}
.td{padding:11px 14px;border-top:1px solid var(--line2);vertical-align:top}
.r{text-align:right}
.dots{display:inline-flex;gap:3px}
.dot{width:7px;height:7px;border-radius:2px;display:inline-block}
.tile{padding:16px 18px}
.tl{font-size:12px;color:var(--mute)}
.tv{font-family:"Source Serif 4",Georgia,serif;font-size:26px;letter-spacing:-.01em;margin-top:4px}
.tv span{font-size:14px;color:var(--mute);font-family:Inter,sans-serif}
.tc{font-size:12px;color:var(--mute);margin-top:2px}
.col{flex:1;display:flex;flex-direction:column-reverse;align-items:stretch;height:100%;padding:0 2px;border:0;background:none;cursor:pointer;border-radius:4px}
.col:hover,.col-on{background:var(--side)}
.col i{display:block;width:100%}
.tabs{display:flex;gap:22px;border-bottom:1px solid var(--line);margin-top:22px}
.tab{border:0;background:none;padding:0 0 10px;cursor:pointer;font-size:14px;color:var(--mute);box-shadow:inset 0 -2px 0 transparent}
.tab-on{color:var(--ink);font-weight:600;box-shadow:inset 0 -2px 0 var(--ink)}
.seg{display:inline-flex;gap:2px;padding:3px;border-radius:10px;background:var(--sand)}
.seg button{border:0;background:none;border-radius:7px;padding:4px 11px;font-size:12.5px;cursor:pointer;color:var(--ink2)}
.seg .seg-on{background:var(--card);color:var(--ink);font-weight:600;box-shadow:var(--shadow)}
.frow{display:grid;grid-template-columns:16px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 18px;border-top:1px solid var(--line2)}
.trow{display:grid;grid-template-columns:16px minmax(0,1fr) auto;gap:12px;align-items:center;padding:9px 18px 9px 46px;border-top:1px solid var(--line2);font-size:13px}
.erow{display:grid;grid-template-columns:minmax(0,1fr) auto 16px;gap:14px;align-items:center;width:100%;padding:13px 18px;border:0;border-top:1px solid var(--line2);background:none;cursor:pointer;text-align:left}
.erow:hover{background:var(--side)}
.pill{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px 0 6px;border-radius:999px;font-size:12.5px;font-weight:600}
.code{margin:0;padding:12px 14px;border-radius:10px;background:var(--side);font:400 12px/1.6 "JetBrains Mono",ui-monospace,monospace;color:var(--ink2);overflow-x:auto;white-space:pre}
.code b{color:var(--badt);font-weight:500}
/* The app's text link (squally-app TEXT_LINK, 01.11.2026): ink, 1px underline at 30% of the ink, 3px below, full ink on hover. */
.lnk{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:color-mix(in srgb,currentColor 30%,transparent);transition:text-decoration-color .15s}.lnk:hover{text-decoration-color:currentColor}
.theme{display:inline-flex;gap:2px;padding:3px;border-radius:10px;background:var(--sand)}
.theme button{display:grid;place-items:center;width:28px;height:24px;border:0;border-radius:7px;background:none;cursor:pointer;color:var(--mute)}
.theme .on{background:var(--card);color:var(--ink);box-shadow:var(--shadow)}
@media (max-width:760px){
.dw{border-radius:16px!important}
.dw-body{height:auto!important;flex-direction:column;flex-wrap:nowrap!important}
.dw-side{flex:none!important;flex-direction:row!important;gap:4px!important;padding:8px!important;overflow-x:auto;width:100%}
.dw-side .side-btn{width:auto;flex:none;white-space:nowrap;padding:7px 10px}
.dw-only-wide{display:none!important}
.dw-main{height:640px!important;flex:none!important}
.dw-hint{display:none!important}
.dw-scroll{padding:18px 16px 28px!important}
.ptitle{font-size:26px}
.lede{font-size:15px}
.run-row{grid-template-columns:16px minmax(0,1fr) 16px;gap:8px 12px;padding:14px 14px}
.run-row>.g{grid-row:1}
.run-row>.chev{grid-column:3;grid-row:1}
.rr-num,.rr-main,.rr-res{grid-column:2}
.rr-num{flex-direction:row!important;flex-wrap:wrap;align-items:center;gap:4px 12px!important}
.rr-when{grid-column:2;flex-direction:row;align-items:center;gap:14px}
.tg{grid-template-columns:minmax(0,1fr) 70px!important}
.tg .bar{display:none}
.seg-scroll{max-width:100%;overflow-x:auto}
.seg button{white-space:nowrap}
.frow{padding:12px 14px}
.trow{padding:9px 14px 9px 30px;grid-template-columns:16px minmax(0,1fr)}
.trow>.facts{grid-column:2}
.erow{padding:13px 14px}
}

/* alignment with squally-app (20.10.2026) */
.th{white-space:nowrap}
.zero{color:var(--mute);opacity:.55}
.shrow{grid-template-columns:16px 64px minmax(0,1fr) auto 14px}
.brow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,260px) 120px;gap:16px;align-items:center;padding:13px 20px;border-top:1px solid var(--line2)}.brow:first-child{border-top:0}
.gl{position:relative}.gl span{position:absolute;right:0;top:-15px;font-size:11px;color:var(--mute);font-style:normal}
.xl{display:flex;margin-top:8px;font-size:11px}.xl span{flex:1;text-align:center}
@media (max-width:760px){.brow{grid-template-columns:minmax(0,1fr) auto;padding:12px 14px}}
.erow .fcw.on{transform:rotate(180deg)}
.ov2 .tg>div:first-child>div:first-child{white-space:normal;overflow:visible}
.td.r{white-space:nowrap}
/* runs list: commit column on two lines while the card is wide enough;
   below that the facts wrap instead of clipping the author */
.dw-scroll{container-type:inline-size}
.rr-main .facts{gap:4px 12px}
@container (min-width:840px){.rr-main .facts{flex-wrap:nowrap}}