.screen-mock{background:radial-gradient(circle at 92% 6%, var(--blue-1), transparent 34%), radial-gradient(circle at 6% 94%, var(--primary-1), transparent 36%), linear-gradient(145deg, var(--bg-canvas), var(--primary-0));width:100%;min-width:0;height:100%;color:var(--fg-primary);border-radius:11px;flex-direction:column;padding:clamp(14px,2vw,22px);display:flex}.screen-mock__chrome{flex:none;align-items:center;gap:10px;padding:0 clamp(6px,.8vw,10px) clamp(8px,1.1vw,12px);display:flex}.screen-mock__dots{gap:5px;display:inline-flex}.screen-mock__dots i{background:var(--gray-3);border-radius:50%;width:7px;height:7px}.screen-mock__crumb{color:var(--fg-tertiary);font-size:clamp(9px,1vw,10.5px);font-weight:var(--fw-semibold);white-space:nowrap;text-overflow:ellipsis;align-items:center;gap:3px;display:inline-flex;overflow:hidden}.screen-mock__crumb svg{flex:none}.screen-mock__body{border:1px solid var(--border-subtle);background:var(--bg-canvas);min-height:0;box-shadow:0 22px 54px -42px color-mix(in srgb, var(--gray-9) 55%, transparent);border-radius:14px;flex-direction:column;flex:auto;gap:clamp(10px,1.5vw,16px);padding:clamp(14px,2.2vw,24px);display:flex;overflow:hidden}.screen-mock__head{flex:none;justify-content:space-between;align-items:flex-start;gap:14px;display:flex}.screen-mock__head strong{letter-spacing:-.01em;word-break:keep-all;font-size:clamp(15px,1.8vw,21px);line-height:1.25;display:block}.screen-mock__head p{color:var(--fg-secondary);word-break:keep-all;margin:5px 0 0;font-size:clamp(10px,1.05vw,12px);line-height:1.45}.screen-mock__action{border-radius:var(--radius-pill);background:var(--primary-7);color:var(--fg-on-primary);font-size:clamp(9.5px,1vw,11.5px);font-weight:var(--fw-bold);white-space:nowrap;flex:none;padding:7px 13px}.screen-mock__stats{grid-template-columns:repeat(var(--screen-mock-stat-cols,4), minmax(0, 1fr));flex:none;gap:clamp(7px,.9vw,11px);display:grid}.screen-mock__stats[data-count="2"]{--screen-mock-stat-cols:2}.screen-mock__stats[data-count="3"]{--screen-mock-stat-cols:3}.screen-mock__stat{border:1px solid var(--border-subtle);background:var(--bg-subtle);border-radius:12px;min-width:0;padding:clamp(9px,1.2vw,14px) clamp(10px,1.3vw,15px)}.screen-mock__stat.is-primary{border-color:var(--primary-2);background:var(--primary-0)}.screen-mock__stat.is-warn{border-color:var(--orange-1);background:var(--orange-0)}.screen-mock__stat small{color:var(--fg-tertiary);font-size:clamp(9px,.95vw,10.5px);font-weight:var(--fw-semibold);white-space:nowrap;text-overflow:ellipsis;display:block;overflow:hidden}.screen-mock__stat strong{font-size:clamp(17px,2.1vw,25px);font-weight:var(--fw-extrabold);letter-spacing:-.02em;align-items:baseline;gap:2px;margin-top:4px;line-height:1.1;display:flex}.screen-mock__stat.is-primary strong{color:var(--primary-8)}.screen-mock__stat.is-warn strong{color:var(--orange-5)}.screen-mock__stat strong i{font-size:clamp(9.5px,1vw,11.5px);font-style:normal;font-weight:var(--fw-semibold);color:var(--fg-tertiary)}.screen-mock__stat em{color:var(--fg-secondary);word-break:keep-all;margin-top:4px;font-size:clamp(8.5px,.92vw,10px);font-style:normal;line-height:1.35;display:block}.screen-mock__bars{flex-direction:column;flex:auto;justify-content:center;gap:clamp(9px,1.8vw,22px);min-height:0;display:flex}.screen-mock__bar{grid-template-columns:minmax(58px,.9fr) minmax(0,3fr) minmax(48px,.8fr);align-items:center;gap:clamp(8px,1vw,13px);display:grid}.screen-mock__bar-label{font-size:clamp(9.5px,1vw,11.5px);font-weight:var(--fw-semibold);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.screen-mock__bar-track{border-radius:var(--radius-pill);background:var(--gray-1);height:clamp(8px,1.2vw,13px);display:block;overflow:hidden}.screen-mock__bar-track i{border-radius:var(--radius-pill);background:linear-gradient(90deg, var(--primary-5), var(--primary-7));height:100%;display:block}.screen-mock__bar.is-warn .screen-mock__bar-track i{background:linear-gradient(90deg, var(--orange-1), var(--orange-5))}.screen-mock__bar-caption{color:var(--fg-secondary);font-size:clamp(9px,.95vw,10.5px);font-weight:var(--fw-semibold);text-align:right;white-space:nowrap}.screen-mock__bar.is-warn .screen-mock__bar-caption{color:var(--orange-5)}.screen-mock__rows{flex-direction:column;flex:auto;gap:clamp(5px,.7vw,8px);min-height:0;display:flex;overflow:hidden;-webkit-mask-image:linear-gradient(#000 calc(100% - 26px),#0000);mask-image:linear-gradient(#000 calc(100% - 26px),#0000)}.screen-mock__columns{color:var(--fg-tertiary);font-size:clamp(8.5px,.9vw,10px);font-weight:var(--fw-bold);justify-content:space-between;align-items:center;padding:0 clamp(10px,1.2vw,14px) 2px;display:flex}.screen-mock__row{border:1px solid var(--border-subtle);background:var(--bg-canvas);border-radius:11px;align-items:center;gap:clamp(8px,1vw,12px);padding:clamp(8px,1.1vw,13px) clamp(10px,1.2vw,14px);display:flex}.screen-mock__row.is-depth-1{background:var(--bg-subtle);margin-left:clamp(12px,1.8vw,24px)}.screen-mock__row.is-depth-2{background:var(--bg-subtle);margin-left:clamp(24px,3.6vw,48px)}.screen-mock__avatar,.screen-mock__row-icon{width:clamp(24px,2.6vw,30px);height:clamp(24px,2.6vw,30px);font-size:clamp(9.5px,1vw,11px);font-weight:var(--fw-bold);border-radius:50%;flex:none;place-items:center;display:grid}.screen-mock__avatar{background:var(--primary-1);color:var(--primary-8)}.screen-mock__row-icon{background:var(--bg-subtle);color:var(--primary-7);border-radius:9px}.screen-mock__row-body{flex:auto;min-width:0}.screen-mock__row-body strong{word-break:keep-all;font-size:clamp(10.5px,1.15vw,13px);line-height:1.3;display:block}.screen-mock__row-body small{color:var(--fg-tertiary);word-break:keep-all;margin-top:2px;font-size:clamp(8.5px,.92vw,10.5px);line-height:1.35;display:block}.screen-mock__progress{border-radius:var(--radius-pill);background:var(--gray-1);height:5px;margin-top:6px;display:block;overflow:hidden}.screen-mock__progress i{border-radius:var(--radius-pill);background:var(--primary-6);height:100%;display:block}.screen-mock__row-meta{color:var(--fg-tertiary);font-size:clamp(8.5px,.92vw,10.5px);font-weight:var(--fw-medium);white-space:nowrap;flex:none}.screen-mock__chip{border:1px solid var(--border-default);border-radius:var(--radius-pill);background:var(--bg-subtle);color:var(--fg-secondary);font-size:clamp(8.5px,.9vw,10px);font-weight:var(--fw-bold);white-space:nowrap;flex:none;align-items:center;gap:3px;padding:4px 9px;display:inline-flex}.screen-mock__chip.is-done{border-color:var(--primary-2);background:var(--primary-0);color:var(--primary-8)}.screen-mock__chip.is-active{border-color:var(--blue-1);background:var(--blue-0);color:var(--blue-5)}.screen-mock__chip.is-warn{border-color:var(--orange-1);background:var(--orange-0);color:var(--orange-5)}.screen-mock__chip.is-wait{border-style:dashed}.screen-mock__footnote{color:var(--fg-secondary);font-size:clamp(9px,.98vw,11px);font-weight:var(--fw-medium);word-break:keep-all;flex:none;align-items:center;gap:6px;margin:0;line-height:1.45;display:flex}.screen-mock__footnote svg{color:var(--primary-7);flex:none}@media (max-width:860px){.screen-mock__stats{--screen-mock-stat-cols:2}.screen-mock__row-meta{display:none}.screen-mock__bar{grid-template-columns:minmax(46px,1fr) minmax(0,2.4fr) auto}}@media (max-width:560px){.screen-mock{padding:10px}.screen-mock__chrome{display:none}.screen-mock__body{gap:8px;padding:12px}.screen-mock__head p,.screen-mock__stat em{display:none}.screen-mock__row{padding:7px 9px}.screen-mock__row-body small,.screen-mock__footnote{display:none}}