.monthly-root,.monthly-browser,.monthly-reader{display:flex;flex-direction:column;min-height:0;height:100%;min-width:0}
.monthly-root [hidden]{display:none!important}
.monthly-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-bottom:14px;border-bottom:1px solid var(--rule)}
.monthly-month-label{display:flex;align-items:center;gap:15px;font-size:12px;font-weight:600}
.monthly-month{min-width:0;max-width:260px;padding:8px 30px 8px 10px;border:1px solid #000;background:#f2f2f2;color:#000;font:600 17px Pretendard,Arial,sans-serif;border-radius:2px}
.monthly-refresh{flex-shrink:0;background:transparent;border:1px solid var(--rule);padding:9px 11px;font-size:11px;border-radius:2px}
.monthly-refresh:disabled{opacity:.45;cursor:wait}
.monthly-filterbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 0}
.monthly-levels{display:flex;gap:5px;flex-wrap:wrap}
.monthly-levels button{border:1px solid var(--rule);background:transparent;padding:6px 10px;font-size:11px;border-radius:2px}
.monthly-levels button[aria-pressed=true]{background:#000;color:var(--surface);border-color:#000}
.monthly-count{font-size:10px;white-space:nowrap}
.monthly-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:max-content;gap:12px;align-content:start;overflow:auto;min-height:0;flex:1;padding:3px 6px 6px 3px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#627a6b transparent}
.monthly-card{--card-tab:#ffc366;--card-signal:#ee93dc;display:flex;flex-direction:column;min-width:0;text-align:left;padding:0;background:#f2f2f2;border:1px solid #000;border-radius:6px 6px 2px 2px;overflow:hidden;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.monthly-card[data-lesson-level="1"]{--card-tab:#aab9b3;--card-signal:#9be96e}
.monthly-card[data-lesson-level="2"]{--card-tab:#989576;--card-signal:#ffc366}
.monthly-card[data-lesson-level="3"]{--card-tab:#e5e5e5;--card-signal:#8fc5cc}
.monthly-card:hover{transform:translateY(-2px);box-shadow:0 3px 0 #000}
.monthly-card:focus-visible{outline-offset:2px}
.monthly-card-top{position:relative;display:flex;align-items:flex-start;justify-content:space-between;height:29px;flex-shrink:0;background:#e5e5e5;border-bottom:5px solid #000}
.monthly-card-tab{height:24px;min-width:106px;display:flex;align-items:center;gap:8px;padding:0 28px 0 10px;background:var(--card-tab);clip-path:polygon(0 0,calc(100% - 18px) 0,100% 100%,0 100%);font-size:9px;font-weight:550}
.monthly-card-index{display:grid;place-items:center;border-radius:50%;width:15px;height:15px;background:#0001;font:8px monospace}
.monthly-card-corner{margin:3px 9px 0 0;font-size:15px;line-height:1;transition:transform .35s var(--ease)}
.monthly-card:hover .monthly-card-corner{transform:translate(1px,-1px)}
.monthly-cover{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:100%;height:143px;background:#e5e5e5;border-bottom:1px solid #0003;font:8px monospace;color:#606960}
.monthly-cover img{display:block;width:100%;height:100%;object-fit:contain}
.monthly-card-body{position:relative;display:block;padding:10px 12px 9px;color:#000;background-color:#f2f2f2;background-image:linear-gradient(#00000013 1px,transparent 1px),linear-gradient(90deg,#00000013 1px,transparent 1px),linear-gradient(#00000006 1px,transparent 1px),linear-gradient(90deg,#00000006 1px,transparent 1px);background-size:48px 48px,48px 48px,12px 12px,12px 12px;background-position:-1px -1px}
.monthly-card-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:9px}
.monthly-level{display:flex;align-items:baseline;gap:5px;color:#000;white-space:nowrap;transition:transform .35s var(--ease)}
.monthly-level-prefix{font:10px monospace;letter-spacing:-.03em}
.monthly-level-number{font:500 37px/.9 Arial,sans-serif;letter-spacing:-.085em}
.monthly-card:hover .monthly-level{transform:translateY(-1px)}
.monthly-card-orbit{position:relative;display:block;width:34px;height:34px;margin-left:8px;flex-shrink:0}
.monthly-card-disc{position:relative;display:block;width:100%;height:100%;border-radius:50%;background:#000;animation:monthly-disc-turn 22s linear infinite;animation-play-state:paused}
.monthly-card.is-card-visible .monthly-card-disc{animation-play-state:running}
.monthly-card:nth-child(3n+2) .monthly-card-disc{animation-duration:27s;animation-direction:reverse;animation-delay:-8s}
.monthly-card:nth-child(3n) .monthly-card-disc{animation-duration:19s;animation-delay:-13s}
.monthly-card-disc::before,.monthly-card-disc::after{content:'';position:absolute;left:calc(50% - .75px);width:1.5px;height:6px;background:#f2f2f2}
.monthly-card-disc::before{top:6px}.monthly-card-disc::after{bottom:6px}
.monthly-card-signal{position:absolute;top:0;left:-6px;width:4px;height:4px;border-radius:50%;background:var(--card-signal)}
.folder:not(.is-active) .monthly-card-disc{animation-play-state:paused}
.monthly-card-title{display:block;font-size:14px;font-weight:650;line-height:1.4;letter-spacing:-.035em;min-height:39px;color:#000;overflow-wrap:anywhere}
.monthly-card-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-top:7px;margin-top:9px;border-top:1px solid #0003;font:7px monospace;letter-spacing:.025em;color:#48534b}
.monthly-card-open{font:8px Pretendard,Arial,sans-serif;color:#000;white-space:nowrap}
@keyframes monthly-disc-turn{to{transform:rotate(360deg)}}
.monthly-status{font-size:10px;line-height:1.5;padding-top:9px;flex-shrink:0;color:var(--quiet)}
.monthly-empty{grid-column:1/-1;padding:30px 4px;font-size:13px;color:var(--quiet)}
.monthly-readerbar{display:flex;align-items:center;gap:14px;padding-bottom:12px;flex-shrink:0}
.monthly-back{flex-shrink:0;background:#000;color:var(--surface);font-size:11px;padding:10px 12px;border-radius:2px}
.monthly-reader-title{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.monthly-external{font-size:10px;white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.monthly-lesson-frame{display:block;width:100%;flex:1;min-height:0;border:1px solid #0003;background:#fff;border-radius:2px}
@media(max-width:1499px){.monthly-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.monthly-cover{height:120px}}
@media(max-width:1100px) and (min-width:761px){.monthly-month-label{gap:8px;font-size:10px}.monthly-month{font-size:14px}.monthly-levels button{padding:5px 7px}.monthly-cover{height:100px}.monthly-card-body{padding:8px}.monthly-card-title{font-size:12px;min-height:34px}}
@media(max-width:760px){.monthly-toolbar{gap:8px;padding-bottom:10px}.monthly-month-label{font-size:0;gap:0;flex:1;min-width:0}.monthly-month{font-size:14px;width:100%;padding:8px 20px 8px 7px}.monthly-refresh{font-size:10px;padding:9px 8px}.monthly-filterbar{align-items:flex-start;gap:6px;padding:10px 0}.monthly-levels{gap:4px}.monthly-levels button{font-size:9px;padding:6px}.monthly-count{font-size:9px;padding-top:6px}.monthly-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:2px 3px 3px 2px}.monthly-cover{height:110px}.monthly-card-body{padding:8px}.monthly-card-title{font-size:12px;min-height:34px}.monthly-card-meta{font-size:8px}.monthly-level{font-size:8px}.monthly-status{font-size:9px}.monthly-readerbar{gap:8px;flex-wrap:wrap}.monthly-back{padding:8px;font-size:10px}.monthly-reader-title{font-size:12px}.monthly-external{font-size:9px}.monthly-lesson-frame{min-height:300px}}

@media(max-width:1100px){.monthly-level-number{font-size:32px}.monthly-card-orbit{width:29px;height:29px}.monthly-card-disc::before,.monthly-card-disc::after{height:5px}.monthly-card-disc::before{top:5px}.monthly-card-disc::after{bottom:5px}}
@media(max-width:760px){.monthly-card-top{height:26px;border-bottom-width:4px}.monthly-card-tab{height:22px;min-width:88px;padding:0 23px 0 7px;gap:5px;font-size:8px}.monthly-card-index{width:13px;height:13px;font-size:7px}.monthly-card-corner{font-size:13px;margin:4px 7px 0 0}.monthly-card-body{padding:9px 8px 8px}.monthly-level-prefix{font-size:8px}.monthly-level-number{font-size:30px}.monthly-card-orbit{width:27px;height:27px}.monthly-card-meta{margin-bottom:8px}.monthly-card-foot{font-size:6px;gap:3px}.monthly-card-open{font-size:7px}.monthly-card-title{min-height:34px}}

/* Compact two-line lesson introductions keep the miniature folder silhouette. */
.monthly-card-title{min-height:0}
.monthly-card-description{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:2.9em;margin-top:7px;font-size:11px;font-weight:400;line-height:1.45;letter-spacing:-.02em;color:#54605a;word-break:keep-all;overflow-wrap:anywhere}
@media(max-width:760px){.monthly-card-description{font-size:10px;margin-top:6px}}