/* Calendar 2027 maker: preview stage, page switcher, design thumbnails, logo row */
.cl-sr{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cl-stage{padding:14px;min-height:0;background:#e9e7df}
.cl-stage canvas{display:block;width:100%;height:auto;max-height:none;max-width:520px;margin:0 auto;border-radius:4px;box-shadow:0 12px 28px rgba(15,18,34,.22);background-size:100% 100%}
.cl-stage.wide canvas{max-width:620px}
.cl-tpls{grid-template-columns:repeat(auto-fill,minmax(74px,1fr))}
.cl-tpls .tpl{aspect-ratio:620/877;position:relative}
.cl-tpls .tpl span{position:absolute;left:0;right:0;bottom:0;background:rgba(255,255,255,.92);font:700 11px/1.2 var(--font);color:var(--ink);padding:3px 2px;text-align:center}
.cl-h2-hint{font-weight:600;margin-left:6px}
.cl-logo-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.cl-logo-box{width:52px;height:52px;border:2px solid var(--ink);border-radius:10px;background:#fff center/contain no-repeat}
.cl-logo-row:has(#cl-logo:focus-visible) label.btn{outline:3px solid var(--sun);outline-offset:2px}
.cl-pager{display:flex;gap:8px;align-items:center;margin-bottom:12px}
.cl-pager select{flex:1;min-width:0}
.cl-nav{min-width:44px;padding-left:0;padding-right:0;font-size:22px;line-height:1}
.cl-out-hint{margin-top:10px}
.cl-note{margin-top:12px}
#cl-lays .chip,#cl-sats .chip{min-height:36px}
.switch+.switch{margin-top:2px}
@media (min-width:901px){.cl-app{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}}