/* Demo only: no shared layout rules. */
#calendar [data-tone]{--tone:#4164a0;--wash:#edf2fc}
#calendar [data-tone="1"]{--tone:#7e4c9f;--wash:#f4edf9}
#calendar [data-tone="2"]{--tone:#a4542d;--wash:#fff1e8}
#calendar [data-tone="3"]{--tone:#397663;--wash:#eaf5ef}
#calendar [data-tone="4"]{--tone:#a0446b;--wash:#fceef4}
#calendar [data-tone="5"]{--tone:#3c718e;--wash:#eaf5fb}
#calendar [data-tone="6"]{--tone:#6950a2;--wash:#f0ecfb}
#calendar [data-tone="7"]{--tone:#426b35;--wash:#edf5e9}
#calendar [data-tone="8"]{--tone:#966028;--wash:#faf2e5}
#calendar [data-tone="9"]{--tone:#a34949;--wash:#fbeeee}
#calendar [data-tone="10"]{--tone:#397b7d;--wash:#e7f5f4}
#calendar [data-tone="11"]{--tone:#5e6886;--wash:#eef0f7}
#calendar [data-tone="lunch"]{--tone:#976400;--wash:#fff4cf}
#calendar .demo-legend{display:flex;flex-wrap:wrap;gap:8px 14px;margin:18px 0 24px}
#calendar .demo-key{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:#425951}
#calendar .demo-key:before{content:"";width:9px;height:9px;border-radius:50%;background:var(--tone);flex-shrink:0}
#demoCalendar{grid-template-columns:repeat(auto-fit,minmax(min(100%,270px),1fr));gap:18px;align-items:start}
#demoCalendar .demo-day{padding:0 12px 12px;background:#f7faf9;border:1px solid #dbe6e1;border-radius:18px;overflow:hidden;box-shadow:0 4px 14px #163e3510;min-width:0}
#demoCalendar .demo-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 -12px 12px;padding:16px;background:#e6efeb;color:#173f3a;font-size:18px}
#demoCalendar .demo-class{font-size:11px;background:white;border:1px solid #d0e0d7;padding:5px 8px;border-radius:20px;white-space:nowrap}
#demoCalendar .demo-lesson{padding:11px 12px;margin-top:8px;border:1px solid white;border-left:4px solid var(--tone);border-radius:10px;background:var(--wash);color:#173f3a}
#demoCalendar .demo-meta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 8px;font-size:11px;font-weight:600;color:#4d605b}
#demoCalendar .demo-time{font-variant-numeric:tabular-nums;white-space:nowrap}
#demoCalendar .demo-subject{display:block;font-size:15px;margin:6px 0;line-height:1.35}
#demoCalendar .demo-teachers{font-size:11px;line-height:1.6;color:#465951;overflow-wrap:anywhere}
@media(max-width:600px){#demoCalendar{grid-template-columns:1fr}}
@media print{#demoCalendar .demo-day{break-inside:avoid;box-shadow:none}#demoCalendar .demo-lesson{print-color-adjust:exact;-webkit-print-color-adjust:exact}}