@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=DM+Serif+Display&display=swap');
:root{--ink:#173d35;--muted:#68766d;--paper:#f7f5ee;--line:#d8ddd3;--mint:#e5f1e7;--white:#fffdf8}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--white);color:var(--ink);font-family:'DM Sans',sans-serif}.app-shell{max-width:1440px;margin:auto}
.topbar{min-height:60px;border-bottom:1px solid var(--line);padding:8px clamp(14px,3vw,42px);display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--paper)}.brand{font:clamp(22px,2.5vw,31px)/1 'DM Serif Display',serif;letter-spacing:-.035em;margin:0;white-space:nowrap;display:flex;align-items:center;gap:9px}.brand-icon{width:32px;height:32px;display:block;flex:none}.header-actions{display:flex;align-items:center;gap:6px}.primary-button,.text-button{border-radius:3px;padding:9px 11px;font:700 11px 'DM Sans',sans-serif;white-space:nowrap;cursor:pointer}.primary-button{border:1px solid var(--ink);background:var(--ink);color:white}.text-button{border:1px solid var(--line);background:var(--white);color:var(--ink)}.primary-button span,.text-button span{margin-left:3px}
.gallery-section{padding:0 clamp(14px,3vw,42px) 42px}.type-tabs{display:flex;gap:20px;border-bottom:1px solid var(--line)}.type-tab{border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted);padding:9px 2px 8px;font:700 12px 'DM Sans',sans-serif;cursor:pointer}.type-tab[aria-selected=true]{color:var(--ink);border-bottom-color:var(--ink)}.tab-icon{font-size:14px;vertical-align:-1px;margin-right:4px}
.jump-bar{display:flex;align-items:center;gap:9px;min-height:39px;position:sticky;top:0;z-index:2;background:var(--white);border-bottom:1px solid var(--line)}.jump-bar label{font-size:11px;font-weight:700;white-space:nowrap}.jump-bar input{width:137px;border:1px solid var(--line);background:var(--white);border-radius:2px;color:var(--ink);font:700 11px 'DM Sans',sans-serif;padding:5px 6px;cursor:pointer}.archive-link{margin-left:auto;color:var(--muted);font-size:10px;font-weight:700;text-decoration:none;white-space:nowrap}.archive-link:hover{text-decoration:underline;color:var(--ink)}
.month-section{scroll-margin-top:49px}.month-heading{font:19px 'DM Serif Display',serif;letter-spacing:-.025em;margin:10px 0 7px;border-top:1px solid var(--line);padding-top:8px}.month-section:first-child .month-heading{margin-top:0;border-top:0;padding-top:5px}.month-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:6px}.puzzle-card{position:relative;border:1px solid var(--line);background:var(--paper);border-radius:3px;min-width:0;transition:background .15s}.puzzle-card:hover{background:#edf0e9}.puzzle-card.completed{background:var(--mint);border-color:#a8ccb4}.card-link{height:61px;padding:6px 8px;display:flex;flex-direction:column;justify-content:space-between;text-decoration:none;color:var(--ink)}.card-number{font:27px/.95 'DM Serif Display',serif;letter-spacing:-.035em}.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:3px;width:100%;padding-right:1px}.card-weekday{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.card-status{font-size:9px;color:var(--muted);white-space:nowrap}.complete-button{position:absolute;right:6px;top:6px;width:21px;height:21px;border:1px solid #adc0b1;border-radius:50%;background:var(--white);color:#8fa396;font-size:13px;line-height:18px;text-align:center;cursor:pointer;padding:0}.complete-button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:white}
.load-sentinel{text-align:center;color:var(--muted);font-size:11px;padding:24px 0}.gallery-footer{border-top:1px solid var(--line);padding-top:16px;color:var(--muted);font-size:10px;line-height:1.4}.gallery-footer p{margin:0}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #84b79c;outline-offset:2px}
@media(max-width:1100px){.month-grid{grid-template-columns:repeat(6,minmax(0,1fr))}}@media(max-width:780px){.month-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:550px){.month-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.brand{font-size:20px;gap:7px}.brand-icon{width:27px;height:27px}}@media(max-width:460px){.topbar{flex-wrap:wrap;padding-top:9px;padding-bottom:9px}.brand{font-size:23px}.header-actions{width:100%}.header-actions button{flex:1}}