/* ==================================================================
   custom-calendar.css  (rebuilt 2026-10-05)
   Loaded only on /custom-calendar/. Same look and panel pattern as
   the weekly planner (weekly-planner.css). Every class starts with
   "cc-" and is written out in full, so nothing depends on which
   Tailwind classes are compiled into tailwind.min.css.
   ================================================================== */

/* ---------------- Page layout ---------------- */
.cc-page { max-width: 1320px; margin: 0 auto; padding: 16px 16px 40px; }
.cc-h1 { font-size: 2rem; font-weight: 800; color: #111827; line-height: 1.2; margin: 8px 0 8px; }
.cc-intro { color: #374151; font-size: 1rem; line-height: 1.6; margin: 0 0 20px; max-width: 840px; }

.cc-tool { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 24px; align-items: start; }
.cc-right { min-width: 0; }

/* ---------------- Options panel ---------------- */
.cc-panel { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 10px; padding: 6px 16px 14px;
    position: sticky; top: 12px; max-height: calc(100vh - 24px); overflow-y: auto; overscroll-behavior: contain; }
.cc-set { border: 0; border-bottom: 1px solid #e5e7eb; margin: 0; padding: 12px 0 14px; min-width: 0; }
.cc-set:last-child { border-bottom: 0; padding-bottom: 4px; }
.cc-set legend { font-size: 0.78rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; color: #1e3a8a;
    padding: 0; margin-bottom: 8px; float: left; width: 100%; }
.cc-set legend + * { clear: both; }
.cc-lbl { display: block; font-size: 0.82rem; font-weight: 600; color: #374151; margin: 10px 0 4px; }
.cc-panel select, .cc-panel input[type="date"], .cc-panel input[type="text"] {
    width: 100%; font: inherit; font-size: 0.9rem; padding: 7px 8px; border: 1px solid #d1d5db;
    border-radius: 6px; background: #fff; color: #111827; box-sizing: border-box;
}
.cc-panel select:focus, .cc-panel input:focus-visible, .cc-panel button:focus-visible,
.cc-panel label:focus-within { outline: 2px solid #1e3a8a; outline-offset: 1px; }
.cc-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.cc-hint { font-size: 0.78rem; color: #6b7280; margin: 6px 0 0; line-height: 1.4; }

.cc-seg { display: flex; gap: 6px; margin-top: 2px; }
.cc-seg label { flex: 1; display: flex; align-items: center; gap: 6px; font-size: 0.88rem; background: #fff;
    border: 1px solid #d1d5db; border-radius: 6px; padding: 7px 8px; cursor: pointer; }
.cc-seg label.is-on, .cc-seg label:has(input:checked) { border-color: #1e3a8a; background: #eef2ff; }

.cc-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.cc-card { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 2px; background: #fff;
    border: 1px solid #d1d5db; border-radius: 8px; padding: 8px 4px; cursor: pointer; font-size: 0.86rem; font-weight: 600; }
.cc-card small { font-size: 0.7rem; font-weight: 400; color: #6b7280; }
.cc-card input, .cc-style input, .cc-sw input { position: absolute; opacity: 0; pointer-events: none; }
.cc-card.is-on, .cc-card:has(input:checked) { border-color: #1e3a8a; background: #eef2ff; color: #1e3a8a; }

.cc-check-lbl { display: flex; align-items: flex-start; gap: 8px; font-size: 0.9rem; margin: 7px 0; cursor: pointer; line-height: 1.35; }
.cc-check-lbl input { width: 16px; height: 16px; margin-top: 1px; accent-color: #1e3a8a; flex: none; }
.cc-check-lbl small { display: block; font-size: 0.75rem; color: #6b7280; }

.cc-styles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; }
.cc-style { display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid #d1d5db; border-radius: 6px;
    padding: 6px 8px; font-size: 0.86rem; cursor: pointer; }
.cc-style.is-on, .cc-style:has(input:checked) { border-color: #1e3a8a; background: #eef2ff; font-weight: 600; }
.cc-swatch { width: 18px; height: 18px; border-radius: 4px; flex: none; border: 1px solid #d1d5db; }
.cc-swatch-simple { background: linear-gradient(135deg, #fff 50%, #111 50%); }
.cc-swatch-classic { background: #1e3a8a; }
.cc-swatch-cute { background: linear-gradient(135deg, #fbcfe8 50%, #bae6fd 50%); border-radius: 50%; }
.cc-swatch-aesthetic { background: linear-gradient(135deg, #efe7dc 50%, #7b6a58 50%); }

.cc-colors { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 4px; }
.cc-sw { position: relative; width: 26px; height: 26px; border-radius: 50%; cursor: pointer; border: 2px solid #fff;
    box-shadow: 0 0 0 1px #cbd5e1; display: inline-flex; align-items: center; justify-content: center; }
.cc-sw.is-on, .cc-sw:has(input:checked) { box-shadow: 0 0 0 2px #1e3a8a; }
.cc-sw-auto { background: conic-gradient(#1e3a8a 0 25%, #111 0 50%, #d9468f 0 75%, #7b6a58 0); }
.cc-sw .cc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.cc-mini-btn { width: 34px; height: 34px; flex: none; border: 1px solid #d1d5db; border-radius: 6px; background: #fff;
    font-size: 1.25rem; line-height: 1; cursor: pointer; color: #1e3a8a; }
.cc-mini-btn:hover { background: #eef2ff; }
.cc-link { background: none; border: 0; padding: 0; color: #1e3a8a; text-decoration: underline; cursor: pointer; font: inherit; font-size: 0.85rem; }

/* Events */
.cc-evform { display: grid; grid-template-columns: 1fr; gap: 6px; }
.cc-evrow { display: flex; gap: 6px; }
.cc-evrow input[type="text"] { flex: 1; min-width: 0; }
.cc-add { font: inherit; font-size: 0.88rem; font-weight: 700; padding: 7px 12px; border-radius: 6px; cursor: pointer;
    border: 1px solid #1e3a8a; background: #1e3a8a; color: #fff; flex: none; }
.cc-add:hover { background: #172e6e; }
.cc-evlist { list-style: none; margin: 8px 0 0; padding: 0; max-height: 190px; overflow-y: auto; }
.cc-evlist li { display: flex; align-items: center; gap: 8px; font-size: 0.84rem; padding: 5px 0; border-bottom: 1px solid #eef0f3; }
.cc-evlist .cc-evdate { font-weight: 700; color: #1e3a8a; flex: none; min-width: 3.6em; }
.cc-evlist .cc-evtext { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cc-evlist .cc-evtag { font-size: 0.7rem; color: #6b7280; flex: none; }
.cc-x { border: 0; background: none; color: #9ca3af; font-size: 1.05rem; line-height: 1; cursor: pointer; padding: 2px 4px; border-radius: 4px; }
.cc-x:hover { color: #b91c1c; background: #fef2f2; }
.cc-empty { font-size: 0.8rem; color: #6b7280; margin: 8px 0 0; }

/* Photo */
.cc-photo-btns { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-top: 4px; }
.cc-file { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.cc-filebtn { font: inherit; font-size: 0.86rem; font-weight: 600; padding: 7px 12px; border: 1px solid #1e3a8a; border-radius: 6px;
    background: #fff; color: #1e3a8a; cursor: pointer; }
.cc-filebtn:hover { background: #eef2ff; }
.cc-file:focus-visible + .cc-filebtn { outline: 2px solid #1e3a8a; outline-offset: 1px; }

/* ---------------- Preview ---------------- */
.cc-stage { background: #eef0f3; border: 1px solid #e5e7eb; border-radius: 10px; padding: 12px 16px 16px; }
.cc-monthbar { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 0 0 12px; }
.cc-monthbar strong { font-size: 1.05rem; color: #111827; min-width: 11em; text-align: center; }
.cc-sheet-wrap { position: relative; width: 100%; margin: 0 auto; overflow: hidden; }
.cc-tip { font-size: 0.85rem; color: #4b5563; margin: 10px 2px 0; }
.cc-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.cc-btn { font: inherit; font-size: 0.95rem; font-weight: 600; padding: 10px 18px; border-radius: 6px; cursor: pointer;
    border: 1px solid #1e3a8a; background: #fff; color: #1e3a8a; text-decoration: none; display: inline-flex; align-items: center; }
.cc-btn:hover { background: #eef2ff; }
.cc-btn-primary { background: #1e3a8a; color: #fff; }
.cc-btn-primary:hover { background: #172e6e; }
.cc-btn[disabled] { opacity: 0.6; cursor: wait; }
.cc-btn-excel { border-color: #15803d; color: #15803d; }
.cc-btn-excel:hover { background: #f0fdf4; }
.cc-subactions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin-top: 10px; font-size: 0.85rem; color: #4b5563; }
.cc-status { font-size: 0.88rem; color: #1f2937; font-weight: 600; min-height: 1.3em; margin: 8px 2px 0; }
.cc-note { font-size: 0.82rem; color: #4b5563; margin: 8px 2px 0; }
.cc-note a { color: #1e3a8a; text-decoration: underline; }

/* ---------------- Content ---------------- */
.cc-content { max-width: 880px; margin: 36px auto 0; color: #1f2937; line-height: 1.65; }
.cc-content section { border-top: 1px solid #e5e7eb; padding-top: 22px; margin-top: 26px; }
.cc-content h2 { font-size: 1.45rem; font-weight: 700; color: #111827; margin: 0 0 10px; scroll-margin-top: 16px; }
.cc-content h3 { font-size: 1.08rem; font-weight: 700; color: #111827; margin: 18px 0 4px; scroll-margin-top: 16px; }
.cc-content p { margin: 0 0 10px; }
.cc-content ol, .cc-content ul { margin: 0 0 12px; padding-left: 22px; }
.cc-content ol { list-style: decimal; }
.cc-content ul { list-style: disc; }
.cc-content li { margin: 4px 0; }
.cc-content a { color: #1e3a8a; text-decoration: underline; }
.cc-content table { width: 100%; border-collapse: collapse; margin: 6px 0 14px; font-size: 0.95rem; }
.cc-content th, .cc-content td { text-align: left; padding: 8px 12px; border-bottom: 1px solid #e5e7eb; vertical-align: top; }
.cc-content thead th { background: #f9fafb; font-weight: 700; color: #111827; }

.cc-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 12px 0 4px; }
.cc-feature { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 10px; padding: 14px 16px; }
.cc-feature h3 { margin: 0 0 4px; font-size: 1rem; color: #1e3a8a; }
.cc-feature p { margin: 0; font-size: 0.95rem; color: #374151; }

.cc-idea { border: 1px solid #e5e7eb; border-radius: 10px; padding: 14px 16px; margin: 12px 0; }
.cc-idea h3 { margin-top: 0; }
.cc-use { font: inherit; font-size: 0.88rem; font-weight: 600; color: #1e3a8a; background: #eef2ff; border: 1px solid #c7d2fe;
    border-radius: 6px; padding: 6px 12px; cursor: pointer; margin: 4px 0 0; text-decoration: none; display: inline-block; }
.cc-use:hover { background: #e0e7ff; }
.cc-content a.cc-use { text-decoration: none; }

/* FAQ accordion: same look as /faq/ */
.cc-faq { margin-top: 6px; }
.cc-faq details { border: 1px solid #e5e7eb; border-radius: 10px; background: #fff; margin: 0 0 10px; }
.cc-faq summary { list-style: none; cursor: pointer; padding: 14px 44px 14px 16px; position: relative; }
.cc-faq summary::-webkit-details-marker { display: none; }
.cc-faq summary::after { content: "+"; position: absolute; right: 16px; top: 50%; transform: translateY(-50%);
    font-size: 1.4rem; font-weight: 400; color: #1e3a8a; line-height: 1; }
.cc-faq details[open] summary::after { content: "\2212"; }
.cc-faq summary:hover h3 { color: #1e3a8a; }
.cc-faq summary:focus-visible { outline: 2px solid #1e3a8a; outline-offset: 2px; border-radius: 10px; }
.cc-faq summary h3 { display: inline; margin: 0; font-size: 1rem; font-weight: 600; color: #111827; line-height: 1.45; }
.cc-faq .cc-faq-a { padding: 0 16px 14px; color: #374151; }
.cc-faq .cc-faq-a p { margin: 0; }
.cc-faq-tools { display: flex; justify-content: flex-end; margin: 0 0 8px; }

.cc-content ul.cc-related { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 20px; }

/* ---------------- 2, 3, 4 and 6 month pages (added 2026-10-05) ---------------- */
.cc-switch { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -6px 0 20px; font-size: 0.86rem; }
.cc-switch-lbl { color: #4b5563; font-weight: 600; margin-right: 2px; }
.cc-switch a, .cc-switch .is-on { display: inline-block; padding: 4px 11px; border: 1px solid #d1d5db; border-radius: 999px;
    background: #fff; color: #1e3a8a; font-weight: 600; text-decoration: none; line-height: 1.4; }
.cc-switch a:hover { background: #eef2ff; border-color: #c7d2fe; }
.cc-switch .is-on { background: #1e3a8a; border-color: #1e3a8a; color: #fff; }

.cc-picks { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.cc-picks-3, .cc-picks-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cc-picks-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cc-pick { font: inherit; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; min-width: 0;
    padding: 6px 4px; background: #fff; border: 1px solid #d1d5db; border-radius: 8px; cursor: pointer; color: #111827; line-height: 1.25; }
.cc-pick b { font-size: 0.86rem; white-space: nowrap; }
.cc-pick small { font-size: 0.7rem; color: #6b7280; white-space: nowrap; }
.cc-pick:hover { background: #eef2ff; }
.cc-pick.is-on { border-color: #1e3a8a; background: #eef2ff; color: #1e3a8a; }
.cc-pick.is-on small { color: #1e3a8a; }
.cc-panel .cc-pick:focus-visible { outline: 2px solid #1e3a8a; outline-offset: 1px; }
#ccLookBox .cc-seg { flex-direction: column; }   /* "Boxes to write in" stays on one line */

.cc-tablewrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 6px 0 14px; }
.cc-content .cc-tablewrap table { margin: 0; min-width: 540px; }
.cc-content td.cc-nowrap, .cc-content th.cc-nowrap { white-space: nowrap; }
.cc-callout { background: #f9fafb; border-left: 4px solid #1e3a8a; border-radius: 0 8px 8px 0; padding: 12px 16px; margin: 12px 0 14px; }
.cc-callout p:last-child { margin-bottom: 0; }

@media (max-width: 900px) {
    .cc-tool { grid-template-columns: 1fr; }
    .cc-panel { position: static; max-height: none; overflow: visible; }
    .cc-h1 { font-size: 1.6rem; }
    .cc-stage { padding: 8px 8px 10px; }
    .cc-right { order: -1; }
}
@media (max-width: 600px) {
    .cc-features { grid-template-columns: 1fr; }
    /* Tables fit the phone screen: smaller text, wrapping cells, no sideways scroll */
    .cc-content .cc-tablewrap table { min-width: 0; font-size: 0.86rem; }
    .cc-content .cc-tablewrap th, .cc-content .cc-tablewrap td { padding: 7px 6px; }
    .cc-content td.cc-nowrap, .cc-content th.cc-nowrap { white-space: normal; }
    .cc-content ul.cc-related { grid-template-columns: 1fr; }
    .cc-btn { flex: 1 1 auto; justify-content: center; }
    .cc-monthbar strong { min-width: 8em; font-size: 0.98rem; }
}

/* ==================================================================
   THE CALENDAR SHEET
   Drawn at real paper size (96 px per inch) and scaled down for the
   preview. Sizes are in em, so bigger paper simply uses a bigger font.
   Generous line-height and padding on purpose: the PDF/PNG renderer
   (html2canvas) draws text a little lower than the browser.
   ================================================================== */
.cc-sheet {
    position: absolute; top: 0; left: 0; transform-origin: 0 0;
    background: #fff; color: var(--ink); box-sizing: border-box;
    padding: 2.3em 2.5em 1.4em; display: flex; flex-direction: column; gap: 1.2em;
    font-family: Inter, Arial, Helvetica, sans-serif; line-height: 1.3; overflow: hidden;
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.14);
}
.cc-sheet * { box-sizing: border-box; }
.cc-sheet [contenteditable="true"] { outline: none; cursor: text; }
.cc-sheet [contenteditable="true"]:focus { background: rgba(250, 204, 21, 0.2); }
.cc-sheet.cc-has-photo.cc-o-landscape { flex-direction: row; }

.cc-photo { flex: none; border-radius: var(--r); background-color: var(--softbg); background-size: cover; background-position: center; }
.cc-o-portrait .cc-photo { height: 38%; width: 100%; }
.cc-o-landscape .cc-photo { width: 38%; height: 100%; }
.cc-body { flex: 1; min-height: 0; min-width: 0; display: flex; flex-direction: column; }

.cc-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 1em;
    border-bottom: 0.2em solid var(--accent); padding-bottom: 0.45em; margin-bottom: 0.9em; flex: none; }
/* No overflow:hidden on text: the PDF/PNG renderer draws text a little lower and would cut the letters. */
.cc-title { font-size: 2.5em; font-weight: 800; color: var(--accent); letter-spacing: -0.01em; line-height: 1.35;
    padding: 0.05em 0 0.16em; min-width: 2em; white-space: nowrap; flex: 0 1 auto; }
.cc-sub { font-size: 1.5em; font-weight: 700; color: var(--muted); white-space: nowrap; line-height: 1.35; padding-bottom: 0.12em; }
.cc-blankline { display: inline-block; width: 7em; border-bottom: 1px solid var(--line-strong); height: 1em; vertical-align: baseline; }
.cc-sub .cc-blanklbl { font-size: 0.6em; font-weight: 600; margin-right: 0.4em; }

/* Month grid */
.cc-grid { flex: 1; min-height: 0; display: grid; border-top: 1px solid var(--line-strong); border-left: 1px solid var(--line-strong); }
.cc-grid > div { border-right: 1px solid var(--line-strong); border-bottom: 1px solid var(--line-strong); min-width: 0; min-height: 0; }
.cc-wd { background: var(--headbg); color: var(--headink); font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em;
    text-align: center; font-size: 0.82em; padding: 0.45em 0.2em 0.6em; line-height: 1.3; white-space: nowrap; overflow: hidden; }
.cc-wd.cc-wkh { font-size: 0.7em; letter-spacing: 0; }
.cc-day { display: flex; flex-direction: column; padding: 0.35em 0.5em 0.3em; overflow: hidden; background: #fff; position: relative; }
.cc-day.cc-we { background: var(--webg); }
.cc-day.cc-pad { background: var(--padbg); }
.cc-dtop { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 0.45em; flex: none; line-height: 1.3; }
.cc-num { font-weight: 700; font-size: 1.05em; color: var(--ink); flex: none; padding-bottom: 0.08em; }
.cc-pad .cc-num { color: var(--line-strong); font-weight: 600; }
.cc-hol { font-size: 0.68em; font-weight: 700; color: var(--hol); line-height: 1.3; padding-bottom: 0.12em; min-width: 0; }
.cc-obs { font-size: 0.64em; font-weight: 600; color: var(--obs); line-height: 1.3; padding-bottom: 0.1em; display: block; }
.cc-yev { font-size: 0.74em; font-weight: 700; color: var(--accent); line-height: 1.32; display: block; padding: 0.1em 0 0.08em; }
.cc-num.cc-nhol { color: var(--hol); }
.cc-num.cc-nobs { color: var(--obs); }
.cc-compact .cc-day { padding: 0.25em 0.35em 0.2em; }
.cc-compact .cc-ev, .cc-compact .cc-yev { font-size: 0.68em; }
.cc-ev { flex: 1; min-height: 1.2em; font-size: 0.78em; line-height: 1.32; overflow: hidden; color: var(--ink); padding-top: 0.15em; word-break: break-word; }
.cc-wk { background: var(--softbg); color: var(--muted); font-size: 0.7em; font-weight: 700; text-align: center; padding-top: 0.5em; line-height: 1.3; }
.cc-dblank { display: inline-block; width: 1.8em; border-bottom: 1px solid var(--line-strong); height: 1.05em; }

/* Bottom boxes: notes and the mini months */
.cc-extras { display: grid; gap: 0.9em; height: 21%; flex: none; margin-top: 0.9em; }
.cc-o-portrait .cc-extras { height: 17%; }
.cc-box { border: 1px solid var(--line-strong); border-radius: var(--r); display: flex; flex-direction: column; overflow: hidden; min-height: 0; min-width: 0; }
.cc-box-h { background: var(--softbg); color: var(--accent); font-weight: 700; font-size: 0.8em; text-transform: uppercase;
    letter-spacing: 0.05em; padding: 0.3em 0.7em 0.6em; line-height: 1.35; flex: none; }
.cc-lines { flex: 1; display: flex; flex-direction: column; padding: 0 0.7em 0.35em; min-height: 0; }
.cc-line { flex: 1 1 0; border-bottom: 1px solid var(--line); display: flex; align-items: flex-end; min-height: 0; padding-bottom: 0.3em; }
.cc-line .cc-edit { flex: 1; min-width: 1px; font-size: 0.9em; white-space: nowrap; overflow: hidden; line-height: 1.4; }

/* Mini month (bottom boxes, multi-month and year) */
.cc-mini { display: flex; flex-direction: column; min-height: 0; min-width: 0; padding: 0.3em 0.5em 0.4em; }
.cc-mini-t { font-weight: 700; color: var(--accent); text-align: center; font-size: 0.95em; line-height: 1.35; padding-bottom: 0.25em; white-space: nowrap; }
.cc-mini-g { flex: 1; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-auto-rows: minmax(0, 1fr); min-height: 0; }
.cc-mini-g span { text-align: center; font-size: 0.78em; line-height: 1.35; color: var(--ink); display: flex; align-items: center; justify-content: center; position: relative; }
.cc-mini-g .cc-mh { font-weight: 700; color: var(--muted); font-size: 0.68em; }
.cc-mini-g .cc-mwe { color: var(--muted); }
.cc-mini-g .cc-mhol { color: var(--hol); font-weight: 800; }
.cc-mini-g .cc-mobs { color: var(--obs); font-weight: 700; }
.cc-mini-g .cc-mev { text-decoration: underline; text-decoration-color: var(--accent); text-underline-offset: 0.2em; }

/* Multi-month and year pages */
.cc-months { flex: 1; min-height: 0; display: grid; gap: 1.1em 1.4em; }
.cc-mm { display: flex; flex-direction: column; min-height: 0; min-width: 0; border: 1px solid var(--line); border-radius: var(--r); padding: 0.5em 0.6em 0.4em; }
.cc-mm .cc-mini { flex: 1; padding: 0; }
.cc-mm-list { flex: none; font-size: 0.66em; line-height: 1.4; color: var(--muted); padding-top: 0.35em; border-top: 1px solid var(--line); margin-top: 0.35em; }
.cc-mm-list div { padding-bottom: 0.1em; }
.cc-n3 .cc-mm-list, .cc-n4 .cc-mm-list { font-size: 0.72em; }
.cc-n6 { font-size: 1.15em; }
/* 6 months with day boxes (the default on /6-month-calendar/) */
.cc-n6.cc-boxes { font-size: 1em; gap: 0.9em 1.2em; }
.cc-n6.cc-boxes .cc-mm-big .cc-mini-t { font-size: 1.05em; padding-bottom: 0.2em; }
.cc-n6.cc-boxes .cc-mm-big .cc-grid { font-size: 0.74em; }
.cc-n6.cc-boxes .cc-wd { padding: 0.3em 0.1em 0.45em; }
.cc-n6.cc-boxes .cc-compact .cc-day { padding: 0.15em 0.3em 0.1em; }
.cc-n6.cc-boxes .cc-mm-list { font-size: 0.64em; }
.cc-mm-list b { color: var(--hol); font-weight: 700; }
.cc-mm-big { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.cc-mm-big .cc-mini-t { font-size: 1.25em; text-align: left; padding-bottom: 0.35em; }
.cc-mm-big .cc-grid { font-size: 0.85em; }
/* Grid, not CSS columns: html2canvas does not draw multi-column text correctly. */
.cc-hlist { flex: none; margin-top: 0.8em; font-size: 0.7em; line-height: 1.45; color: var(--muted);
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 1.6em; }
.cc-hlist div { padding-bottom: 0.1em; }
.cc-hlist b { color: var(--hol); font-weight: 700; margin-right: 0.35em; }
.cc-o-portrait .cc-hlist { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cc-legend { flex: none; font-size: 0.66em; color: var(--muted); margin-top: 0.5em; }
.cc-legend b { color: var(--hol); }
.cc-legend i { color: var(--obs); font-style: normal; font-weight: 700; }

.cc-foot { font-size: 0.7em; color: var(--muted); text-align: right; margin-top: 0.6em; flex: none; letter-spacing: 0.02em; }

/* ---------------- Styles (themes) ---------------- */
.cc-t-classic { --ink: #111827; --accent: #1e3a8a; --headbg: #1e3a8a; --headink: #fff; --softbg: #eef2ff;
    --line: #d5dbe5; --line-strong: #94a3b8; --muted: #6b7280; --hol: #b91c1c; --obs: #4b5563;
    --padbg: #f8fafc; --webg: #f1f5fb; --r: 0.35em; }

.cc-t-simple { --ink: #111; --accent: #111; --headbg: #fff; --headink: #111; --softbg: #fff;
    --line: #c9c9c9; --line-strong: #2b2b2b; --muted: #555; --hol: #111; --obs: #555;
    --padbg: #fff; --webg: #f3f3f3; --r: 0; }
.cc-t-simple .cc-wd { border-bottom-width: 2px; }
.cc-t-simple .cc-hol, .cc-t-simple .cc-num.cc-nhol { text-decoration: underline; }
.cc-t-simple .cc-box-h { border-bottom: 1px solid var(--line-strong); }

.cc-t-cute { --ink: #4a3b4f; --accent: #d9468f; --headbg: #fce7f3; --headink: #4a3b4f; --softbg: #fdf2f8;
    --line: #f5cfe0; --line-strong: #efa9c8; --muted: #9d7a92; --hol: #c2185b; --obs: #8e6f86;
    --padbg: #fffafc; --webg: #fff3f8; --r: 0.9em; font-family: "Trebuchet MS", Verdana, Arial, sans-serif; }
.cc-t-cute .cc-grid { border-radius: 0.6em; overflow: hidden; }
.cc-t-cute .cc-wd.cc-c0 { background: #fbcfe8; } .cc-t-cute .cc-wd.cc-c1 { background: #fed7aa; }
.cc-t-cute .cc-wd.cc-c2 { background: #fef08a; } .cc-t-cute .cc-wd.cc-c3 { background: #bbf7d0; }
.cc-t-cute .cc-wd.cc-c4 { background: #bae6fd; } .cc-t-cute .cc-wd.cc-c5 { background: #ddd6fe; }
.cc-t-cute .cc-wd.cc-c6 { background: #fecdd3; }
.cc-t-cute .cc-head { border-bottom-style: dotted; border-bottom-width: 0.3em; }
.cc-t-cute .cc-box, .cc-t-cute .cc-mm { border-width: 2px; }

.cc-t-aesthetic { --ink: #3f3a36; --accent: #7b6a58; --headbg: #efe7dc; --headink: #5b4d40; --softbg: #f6f1ea;
    --line: #e4dbcf; --line-strong: #bcad9b; --muted: #8c7d6e; --hol: #9a5b3f; --obs: #8c7d6e;
    --padbg: #fbf8f4; --webg: #f8f3ec; --r: 0.2em; }
.cc-t-aesthetic .cc-title, .cc-t-aesthetic .cc-sub, .cc-t-aesthetic .cc-mini-t, .cc-t-aesthetic .cc-box-h {
    font-family: Georgia, "Times New Roman", serif; font-weight: 400; letter-spacing: 0.01em; }
.cc-t-aesthetic .cc-title { font-style: italic; }
.cc-t-aesthetic .cc-wd { font-family: Georgia, "Times New Roman", serif; font-weight: 400; text-transform: none; letter-spacing: 0.03em; font-size: 0.95em; }
.cc-t-aesthetic .cc-box-h { text-transform: none; font-size: 0.95em; }
.cc-t-aesthetic .cc-head { border-bottom-width: 1px; }

/* Off-screen copy used while making the PDF or PNG */
.cc-export { position: absolute; left: -40000px; top: 0; }
.cc-export .cc-sheet { position: relative; box-shadow: none; transform: none !important; }
.cc-export [contenteditable="true"]:focus { background: none; }

/* ---------------- Printing ---------------- */
#ccPrint { display: none; }
@media print {
    body > *:not(#ccPrint) { display: none !important; }
    #ccPrint { display: block !important; }
    #ccPrint .cc-sheet { position: relative; box-shadow: none; transform: none !important; }
    #ccPrint [contenteditable="true"]:focus { background: none; }
}