.cal {
    margin-top: var(--space-five);
    display: grid;
    grid-template-columns: var(--axis-w) repeat(var(--days-week), minmax(var(--col-min), 1fr));
    border: var(--border-w) solid var(--border-hairline);
    border-bottom: none;
}

.cal-corner {
    border-right: var(--border-w) solid var(--border-subtle);
    border-bottom: var(--border-w) solid var(--border-hairline);
}

.cal-head {
    display: flex;
    align-items: baseline;
    gap: var(--space-two);
    padding: var(--space-two) var(--space-two) var(--space-three);
    border-right: var(--border-w) solid var(--border-subtle);
    border-bottom: var(--border-w) solid var(--border-hairline);
    font-family: var(--font-ui);
    font-size: var(--fs-caption);
    font-weight: 600;
    letter-spacing: var(--tracking-caps);
    text-transform: uppercase;
    color: var(--text-muted);
}
.cal-head:last-child { border-right: none; }

.cal-head-date {
    font-family: var(--font-mono);
    font-size: var(--fs-small);
    font-weight: 600;
    letter-spacing: var(--tracking-body);
    text-transform: none;
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
}

.cal-head-today { color: var(--accent-text); background: var(--tint-today); }
.cal-head-today .cal-head-date { color: var(--accent-text); }

.cal-axis {
    position: relative;
    border-right: var(--border-w) solid var(--border-subtle);
    border-bottom: var(--border-w) solid var(--border-hairline);
}

.cal-axis span {
    position: absolute;
    right: var(--space-two);
    translate: 0 var(--half-back);
    font-family: var(--font-body);
    font-size: var(--fs-caption);
    line-height: var(--lh-flush);
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.cal-quiet-label {
    position: absolute;
    right: var(--space-two);
    translate: 0 var(--half-back);
    font-family: var(--font-ui);
    font-size: var(--fs-caption);
    font-weight: 600;
    letter-spacing: var(--tracking-caps);
    text-transform: uppercase;
    line-height: var(--lh-flush);
    color: var(--text-muted);
}

.cal-col {
    position: relative;
    border-right: var(--border-w) solid var(--border-subtle);
    border-bottom: var(--border-w) solid var(--border-hairline);
}
.cal-col:last-child { border-right: none; }
.cal-col-today { background: var(--tint-today); }

.cal-rule {
    position: absolute;
    left: 0;
    right: 0;
    border-top: var(--border-w) solid var(--border-subtle);
}
.cal-rule-half { border-top-style: dashed; }

.cal-quiet {
    position: absolute;
    left: 0;
    right: 0;
    height: var(--quiet-h);
    background: var(--bg-sunken);
    border-top: var(--border-w) solid var(--border-subtle);
    border-bottom: var(--border-w) solid var(--border-subtle);
}

.cal-now {
    position: absolute;
    left: 0;
    right: 0;
    height: var(--rule-accent);
    background: var(--highlighter);
}
.cal-now::before {
    content: "";
    position: absolute;
    left: 0;
    top: var(--dot-now-rise);
    width: var(--dot-now);
    height: var(--dot-now);
    border-radius: var(--radius-pill);
    background: var(--ink);
    box-shadow: inset 0 0 0 var(--dot-now-core) var(--highlighter);
}

.block {
    position: absolute;
    display: flex;
    flex-direction: column;
    gap: var(--space-one);
    overflow: hidden;
    padding: var(--space-two);
    border: var(--border-w) solid var(--border-subtle);
    border-left: var(--edge-subject) solid var(--border-subtle);
    border-radius: 0;
    background: var(--bg-surface);
    text-align: left;
    text-decoration: none;
    transition: background var(--t-fast) var(--e-standard), border-color var(--t-fast) var(--e-standard);
}
.block:hover { background: var(--bg-sunken); }
.block:focus-visible { outline: none; box-shadow: var(--ring-focus); }

.block-cover {
    background: var(--bg-canvas);
    border-style: dashed;
    border-color: var(--border-hairline);
    border-left-style: solid;
    border-left-color: var(--border-subtle);
}
.block-cover:hover { background: var(--bg-sunken); }

.sub-chemistry { border-left-color: var(--subject-chemistry); }
.sub-biology { border-left-color: var(--subject-biology); }

.block-code {
    font-family: var(--font-ui);
    font-size: var(--fs-small);
    font-weight: 600;
    line-height: var(--lh-compact);
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.block-time,
.block-place {
    font-family: var(--font-body);
    font-size: var(--fs-caption);
    line-height: var(--lh-compact);
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.block-tag {
    margin-top: auto;
    font-family: var(--font-ui);
    font-size: var(--fs-caption);
    font-weight: 600;
    letter-spacing: var(--tracking-caps);
    text-transform: uppercase;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.block-narrow { padding-left: var(--space-one); padding-right: var(--space-one); }
.block-narrow .block-time,
.block-narrow .block-place { display: none; }

.agenda { display: none; }

@media (max-width: 58rem) {
    .cal { display: none; }
    .agenda { display: block; }
}