.screentime-shell{--screen-chart-1:#2786f5;--screen-chart-2:#17b7a6;--screen-chart-3:#f59e42;--screen-chart-4:#8d6adf;--screen-chart-5:#e85d75;--screen-chart-rest:color-mix(in srgb, var(--foreground) 48%, transparent);--screen-chart-missing:color-mix(in srgb, var(--foreground) 14%, transparent);--screen-card:color-mix(in srgb, var(--foreground) 2.5%, var(--background));--screen-soft:color-mix(in srgb, var(--accent) 9%, var(--background));--screen-border:color-mix(in srgb, var(--foreground) 11%, transparent);--screen-shadow:0 14px 38px color-mix(in srgb, var(--foreground) 6%, transparent);isolation:isolate;padding-block:2rem 4rem;position:relative}[data-theme=dark] .screentime-shell{--screen-chart-1:#65a8ff;--screen-chart-2:#43d5c1;--screen-chart-3:#ffad5c;--screen-chart-4:#b49aff;--screen-chart-5:#ff8095;--screen-card:color-mix(in srgb, white 3.5%, var(--background));--screen-soft:color-mix(in srgb, var(--accent) 10%, var(--background));--screen-border:color-mix(in srgb, var(--foreground) 13%, transparent);--screen-shadow:0 18px 46px #00000024}.dashboard-heading{border-bottom:1px solid var(--screen-border);gap:1.5rem;padding-bottom:1.15rem;display:grid;position:relative}.dashboard-heading-row{justify-content:space-between;align-items:center;gap:1.5rem;display:flex}.section-kicker{color:var(--accent);letter-spacing:.16em;font-size:.68rem;font-weight:750}.dashboard-heading h1{letter-spacing:-.055em;margin:0;font-size:clamp(2rem,5vw,3rem);font-weight:760;line-height:1}.subtitle{color:var(--muted-foreground);margin-top:.65rem;font-size:.95rem}.week-picker,.app-picker{color:var(--muted-foreground);gap:.4rem;font-size:.75rem;font-weight:650;display:grid}.week-picker{flex:none;min-width:12.5rem;margin-top:.05rem}.dashboard-heading .week-picker select{border-color:color-mix(in srgb, var(--foreground) 18%, transparent);background:color-mix(in srgb, var(--foreground) 3%, transparent);text-align:center;text-align-last:center;cursor:pointer;border-radius:999px;width:100%;min-height:2.7rem;padding-block:.58rem;font-size:.8rem;font-weight:720}.dashboard-heading .week-picker select:hover{border-color:color-mix(in srgb, var(--accent) 58%, transparent);background:color-mix(in srgb, var(--accent) 6%, transparent)}.dashboard-heading .week-picker select:focus-visible{border-color:var(--accent);outline:2px solid color-mix(in srgb, var(--accent) 25%, transparent);outline-offset:2px}.screentime-shell select{border:1px solid var(--screen-border);background:var(--screen-card);color:var(--foreground);font:inherit;border-radius:.8rem;padding:.72rem 2.4rem .72rem .85rem;font-size:.85rem}.life-share-statement{width:100%;color:var(--muted-foreground);letter-spacing:-.015em;text-align:left;justify-items:start;margin:0;font-size:clamp(.95rem,2vw,1.08rem);font-weight:540;line-height:1.65;display:grid}.life-share-statement>span:last-child{text-align:right;justify-self:end;margin-top:.08rem}.life-share-statement strong{color:var(--accent);font-variant-numeric:tabular-nums;letter-spacing:-.045em;margin-inline:.18em;font-size:1.35em;font-weight:800}.overview-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.7rem;margin-top:1rem;display:grid}.metric-card,.change-card,.panel{border:1px solid var(--screen-border);background:var(--screen-card)}.metric-card{min-height:12rem;box-shadow:var(--screen-shadow);border-radius:1.15rem;padding:1rem;position:relative;overflow:hidden}.metric-card:nth-child(-n+2){grid-template-rows:auto auto minmax(3.5rem,1fr) minmax(7.2rem,auto) auto auto;display:grid}.metric-card:before{background:linear-gradient(90deg, var(--accent), transparent 72%);content:"";height:2px;position:absolute;top:0;left:0;right:0}.metric-card:nth-child(2):before{background:linear-gradient(90deg, var(--screen-chart-2), transparent 72%)}.metric-card:nth-child(2){background:radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--screen-chart-2) 9%, transparent), transparent 46%), var(--screen-card)}.metric-card:nth-child(3){grid-column:1/-1;grid-template-columns:1fr auto;align-items:center;gap:.25rem 1rem;min-height:6.4rem;display:grid}.metric-card:nth-child(3) p,.metric-card:nth-child(3) span{grid-column:1}.metric-card:nth-child(3) strong{grid-area:1/2/4}.metric-history-toggle{color:var(--accent);border-radius:999px;grid-area:3/1;justify-self:start;margin-top:.4rem;padding:.35rem 0;font-size:.72rem;font-weight:680}.metric-history-toggle:hover{color:color-mix(in srgb, var(--accent) 78%, var(--foreground))}.metric-card-primary{background:var(--screen-soft)}.metric-card p,.change-card p{color:var(--muted-foreground);font-size:.75rem;font-weight:650}.metric-card strong{letter-spacing:-.045em;margin-top:.65rem;font-size:clamp(1.3rem,3vw,1.7rem);line-height:1.05}.metric-card span,.change-card span{color:var(--muted-foreground);font-size:.72rem}.time-share-heading{justify-content:flex-start;align-self:end;align-items:end;gap:.75rem;padding-top:.75rem;display:flex}.time-grid{align-content:center;gap:.16rem;height:7.2rem;margin-top:.55rem;display:grid}.week-time-grid{grid-template-columns:repeat(24,minmax(0,1fr))}.day-time-grid{grid-template-columns:repeat(12,minmax(0,1fr))}.time-grid i{aspect-ratio:1;border:1px solid var(--screen-border);background:color-mix(in srgb, var(--foreground) 4%, transparent);border-radius:.12rem;display:block;position:relative;overflow:hidden}.time-grid i:after{width:var(--cell-fill);background:var(--foreground);content:"";position:absolute;inset:0}.time-grid i.sleep-cell{border-color:color-mix(in srgb, var(--screen-chart-4) 38%, transparent);background:repeating-linear-gradient(135deg, color-mix(in srgb, var(--screen-chart-4) 28%, transparent) 0 2px, color-mix(in srgb, var(--screen-chart-4) 8%, transparent) 2px 5px)}.time-grid-legend{color:var(--muted-foreground);flex-wrap:wrap;gap:.35rem .7rem;margin-top:.45rem;font-size:.62rem;display:flex}.time-grid-legend span{align-items:center;gap:.25rem;display:inline-flex}.time-grid-legend i{border:1px solid var(--screen-border);border-radius:.12rem;width:.58rem;height:.58rem}.metric-card .time-grid-caption{color:var(--muted-foreground);opacity:.76;margin-top:.28rem;font-size:.58rem}.used-swatch{background:var(--foreground)}.awake-swatch{background:color-mix(in srgb, var(--foreground) 4%, transparent)}.sleep-swatch{background:repeating-linear-gradient(135deg, color-mix(in srgb, var(--screen-chart-4) 28%, transparent) 0 2px, color-mix(in srgb, var(--screen-chart-4) 8%, transparent) 2px 4px);border-color:color-mix(in srgb, var(--screen-chart-4) 38%, transparent)!important}.comparison-up{color:#d95c72}.comparison-down{color:#169f8d}.comparison-neutral{color:var(--foreground)}.panel{box-shadow:var(--screen-shadow);border-radius:1.35rem;margin-top:1rem;padding:clamp(1rem,3vw,1.5rem);position:relative}.section-heading{border-bottom:1px solid var(--screen-border);justify-content:space-between;align-items:end;gap:1rem;padding-bottom:.8rem;display:flex}.section-heading h2{letter-spacing:-.025em;margin-top:.15rem;font-size:1.22rem;font-weight:730}.section-heading>p{color:var(--muted-foreground);font-size:.75rem}.composition-grid{grid-template-columns:minmax(15rem,.9fr) minmax(16rem,1.1fr);align-items:center;gap:2rem;margin-top:1.1rem;display:grid}.donut-wrap{width:min(100%,17rem);margin-inline:auto;position:relative}#donut-chart{width:100%;display:block;transform:rotate(.001deg)}.donut-track{fill:none;stroke:var(--screen-chart-missing);stroke-width:28px}.donut-center{text-align:center;place-content:center;display:grid;position:absolute;inset:0}.donut-center strong{letter-spacing:-.04em;max-width:7.5rem;font-size:1.1rem;line-height:1.1}.donut-center span{color:var(--muted-foreground);margin-top:.2rem;font-size:.72rem}.donut-legend{gap:.2rem;display:grid}.donut-legend button,.legend-row{text-align:left;border-radius:.65rem;grid-template-columns:auto 1fr auto;align-items:center;gap:.65rem;width:100%;padding:.55rem .5rem;display:grid}.donut-legend button:hover{background:var(--screen-soft)}.donut-legend strong{font-size:.8rem;font-weight:650}.legend-dot{border-radius:999px;width:.68rem;height:.68rem}.chart-1{background:var(--screen-chart-1)}.chart-2{background:var(--screen-chart-2)}.chart-3{background:var(--screen-chart-3)}.chart-4{background:var(--screen-chart-4)}.chart-5{background:var(--screen-chart-5)}.chart-rest{background:var(--screen-chart-rest)}.chart-missing{background:var(--screen-chart-missing)}.change-grid{grid-template-columns:1fr 1fr;gap:.8rem;margin-top:1rem;display:grid}.change-grid[hidden]{display:none}.change-card{box-shadow:var(--screen-shadow);border-radius:1rem;grid-template-columns:1fr auto;align-items:end;gap:.25rem 1rem;padding:1rem;display:grid;position:relative}.change-card p{grid-column:1/-1}.change-card strong{font-size:1.08rem}.change-card span{color:var(--foreground);font-size:1rem;font-weight:750}.increase-card span{color:#df6277}.decrease-card span{color:#20a995}.change-card small{color:var(--muted-foreground);grid-column:1/-1;font-size:.68rem}.app-ranking{margin-top:.9rem}.ranking-history{border:1px solid var(--screen-border);background:color-mix(in srgb, var(--foreground) 2.5%, transparent);border-radius:1rem;margin:.25rem 0 .85rem 2.75rem;padding:.9rem}.ranking-history[hidden],.total-history-panel[hidden]{display:none}.ranking-history-heading{justify-content:space-between;align-items:end;gap:1rem;display:flex}.ranking-history-heading>div{gap:.12rem;display:grid}.ranking-history-heading small{color:var(--accent);letter-spacing:.14em;font-size:.6rem;font-weight:750}.ranking-history-heading strong{font-size:.92rem}.ranking-history-heading button{color:var(--muted-foreground);border-radius:999px;padding:.35rem .55rem;font-size:.7rem}.ranking-history-heading button:hover{background:var(--screen-soft);color:var(--accent)}.app-row+.app-row{border-top:1px solid var(--screen-border)}.app-row>button,.private-row{text-align:left;grid-template-columns:2rem minmax(0,1fr) minmax(5.5rem,auto);align-items:center;gap:.75rem;width:100%;padding:.85rem .25rem;display:grid}.app-row>button:hover .app-line strong{color:var(--accent)}.app-row>button.history-active{background:var(--screen-soft);border-radius:.75rem}.rank-number{border:1px solid var(--screen-border);width:1.55rem;height:1.55rem;color:var(--muted-foreground);font-variant-numeric:tabular-nums;border-radius:.42rem;place-items:center;font-size:.74rem;display:grid}.app-main{min-width:0}.app-line{justify-content:space-between;align-items:baseline;gap:1rem;display:flex}.app-line strong{text-overflow:ellipsis;white-space:nowrap;font-size:.95rem;overflow:hidden}.app-line span{color:var(--muted-foreground);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:.76rem}.usage-track{background:var(--muted);border-radius:999px;height:.25rem;margin-top:.42rem;display:block;overflow:hidden}.usage-fill{border-radius:inherit;background:linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 68%, var(--screen-chart-2)));height:100%;display:block}.app-delta{font-variant-numeric:tabular-nums;justify-content:flex-end;display:flex}.delta-badge{--delta-color:var(--muted-foreground);border:1px solid color-mix(in srgb, var(--delta-color) 30%, transparent);background:color-mix(in srgb, var(--delta-color) 9%, transparent);min-width:10.5rem;color:var(--delta-color);border-radius:.7rem;grid-template-columns:1.55rem auto;align-items:center;gap:.4rem;padding:.35rem .5rem .35rem .35rem;display:grid}.delta-icon{background:color-mix(in srgb, var(--delta-color) 15%, transparent);border-radius:.48rem;place-items:center;width:1.55rem;height:1.55rem;font-size:.85rem;font-weight:800;line-height:1;display:grid}.delta-copy{text-align:left;gap:.05rem;display:grid}.delta-copy strong{color:inherit;white-space:nowrap;font-size:.7rem;font-weight:720;line-height:1.15}.delta-copy small{color:inherit;opacity:.78;font-size:.62rem;font-weight:650;line-height:1.1}.delta-up{--delta-color:#df6277}.delta-down{--delta-color:#20a995}.delta-neutral{--delta-color:var(--muted-foreground)}.private-row{color:var(--muted-foreground)}.text-button{color:var(--accent);margin:.8rem auto 0;padding:.5rem .75rem;font-size:.82rem;font-weight:680;display:block}.history-heading{align-items:center}.app-picker select{min-width:10rem}.history-shortcuts{scrollbar-width:thin;gap:.45rem;margin-top:1rem;padding-bottom:.25rem;display:flex;overflow-x:auto}.history-shortcuts button{border:1px solid var(--screen-border);color:var(--muted-foreground);border-radius:999px;flex:none;padding:.45rem .75rem;font-size:.76rem}.history-shortcuts button:hover,.history-shortcuts button.active{border-color:var(--accent);background:var(--screen-soft);color:var(--accent)}.line-chart-wrap{border:1px solid var(--screen-border);background:color-mix(in srgb, var(--foreground) 2%, transparent);border-radius:1rem;width:100%;margin-top:.8rem;padding:.45rem;overflow-x:auto}.history-line-chart{width:100%;min-width:32rem;height:auto;display:block}.history-line-chart .chart-grid-line{stroke:var(--border);stroke-width:1px}.history-line-chart .chart-axis-label{fill:var(--muted-foreground);font-family:inherit;font-size:11px}.history-line-chart .history-line{stroke:var(--accent);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.history-line-chart .history-point{fill:var(--accent);stroke:var(--background);stroke-width:3px}.history-line-chart .history-point.incomplete{fill:var(--background);stroke:var(--accent);stroke-width:3px}.history-summary{border:1px solid var(--screen-border);background:color-mix(in srgb, var(--foreground) 2%, transparent);color:var(--muted-foreground);border-radius:.85rem;justify-content:space-between;align-items:baseline;gap:1rem;margin-top:.9rem;padding:.75rem .85rem;font-size:.8rem;display:flex}.history-summary strong{color:var(--foreground);text-align:right}@media (width<=720px){.screentime-shell{padding-top:1.4rem}.dashboard-heading{gap:1.2rem}.week-picker{min-width:10.75rem;margin-top:0}.week-picker select{width:100%}.overview-grid{grid-template-columns:1fr}.metric-card:nth-child(3){grid-column:auto}.metric-card{min-height:11rem}.composition-grid{grid-template-columns:1fr;gap:1rem}.donut-wrap{width:min(100%,17rem)}.app-row>button,.private-row{grid-template-columns:1.6rem minmax(0,1fr)}.app-delta{grid-column:2;justify-content:flex-start;margin-top:-.35rem}.ranking-history{margin-left:0}}@media (width<=430px){.overview-grid,.change-grid{grid-template-columns:1fr}.metric-card-primary{grid-column:auto}.metric-card:nth-child(3){grid-template-columns:1fr auto;min-height:8.5rem;display:grid}.metric-card{min-height:10.5rem}.section-heading{align-items:start}.section-heading>p{text-align:right;max-width:8rem}.history-heading{flex-direction:column;align-items:stretch}.app-picker select{width:100%}}@media (prefers-reduced-motion:reduce){.usage-fill{transition:none}}
