/* Shared theme is loaded by App.razor, including non-prerendered WASM pages. */
:root { --bs-primary:#1d5a46; --bs-primary-rgb:29,90,70; --bs-link-color:#1d5a46; --bs-link-hover-color:#123e2e; --bs-body-color:#233e34; --bs-body-bg:#f7f9f5; }
html { scroll-padding-top:6rem; }
body { color:#233e34; background:#f7f9f5; }
a,.btn-link { color:#1d5a46; }
.btn-primary { background-color:var(--bs-btn-bg); border-color:var(--bs-btn-border-color); color:var(--bs-btn-color); --bs-btn-color:#fff; --bs-btn-bg:#1d5a46; --bs-btn-border-color:#1d5a46; --bs-btn-hover-color:#fff; --bs-btn-hover-bg:#144431; --bs-btn-hover-border-color:#144431; --bs-btn-active-color:#fff; --bs-btn-active-bg:#123c2d; --bs-btn-active-border-color:#123c2d; --bs-btn-disabled-bg:#477a66; --bs-btn-disabled-border-color:#477a66; --bs-btn-focus-shadow-rgb:29,90,70; }
.btn-outline-success { --bs-btn-color:#1d5a46; --bs-btn-border-color:#9bb8a8; --bs-btn-hover-bg:#e7f1e9; --bs-btn-hover-color:#163f31; --bs-btn-hover-border-color:#6f9a82; --bs-btn-active-bg:#dcebe1; --bs-btn-active-color:#163f31; }
.btn { min-height:46px; padding:.65rem 1.15rem; border-radius:.7rem; font-weight:650; }
.btn:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible { outline:3px solid #bd7e28; outline-offset:3px; }
.btn:focus,.btn:active:focus,.form-check-input:focus { box-shadow:0 0 0 .22rem #26735025; }
.form-control:focus,.form-select:focus { border-color:#5f9677; box-shadow:0 0 0 .22rem #26735025; }
.form-check-input:checked { background-color:#1d5a46; border-color:#1d5a46; }
.auth-page { padding:clamp(1rem,3vw,2.5rem) 0; }
.auth-shell { border:1px solid #dce7dc; box-shadow:0 14px 50px #193d2b0b; border-radius:1.3rem; overflow:hidden; }
.auth-aside { background:linear-gradient(150deg,#eff5e8,#e4efdf); color:#204b37; }
.auth-aside h2 { color:#1c4934; }
.auth-card { background:#fff; padding:clamp(1.5rem,4vw,2.5rem); }
.auth-card h1 { color:#193e2d; }
.auth-card .form-control { min-height:48px; border-radius:.65rem; border-color:#b8cdbd; }
.auth-card .btn-block { margin-top:1rem; }
.daily-catalog-page { max-width:920px; padding-top:.6rem; }
.crossword-page.guest-catalog { padding:0 0 .5rem; font-size:1rem; }
.crossword-page.account-catalog { max-width:1320px; margin-inline:auto; font-size:1rem; }
.account-catalog > .puzzle-header { padding:.5rem 0 1.5rem; }
.account-catalog > .puzzle-header h1 { font-size:clamp(1.8rem,4vw,2.4rem); }
.daily-catalog-page .puzzle-header { border:0; padding:.6rem 0 1.4rem; margin:0; }
.daily-catalog-page .puzzle-header h1 { font-size:clamp(1.9rem,4vw,2.7rem); margin:.4rem 0 .6rem; }
.daily-catalog-page .puzzle-header p { max-width:58ch; color:#566c5f; font-size:1.05rem; margin:0; }
.daily-notice { position:relative; padding:clamp(1.3rem,3vw,2rem); margin:0 0 1.6rem; border:1px solid #c8dccb; border-radius:1.25rem; background:linear-gradient(125deg,#edf5e5,#f7faf2); box-shadow:0 8px 26px #1d4c3210; }
.daily-notice-top { display:flex; justify-content:space-between; align-items:center; gap:.8rem; flex-wrap:wrap; }
.daily-date { color:#43634d; font-size:.88rem; font-weight:650; letter-spacing:.01em; }
.daily-chip,.hint-budget-pill { display:inline-flex; align-items:center; border-radius:100px; padding:.35rem .8rem; background:#dbead5; color:#27583d; font-size:.86rem; font-weight:700; line-height:1.5; }
.daily-notice-content { display:grid; grid-template-columns:minmax(0,1fr) 110px; gap:1.4rem; align-items:center; padding:1.1rem 0 1.4rem; }
.daily-notice h2 { font-size:clamp(1.7rem,3.5vw,2.3rem); font-weight:750; color:#193f2c; line-height:1.2; margin:0 0 .7rem; }
.daily-notice-content p { color:#4b6754; max-width:49ch; margin-bottom:1.2rem; font-size:1.05rem; }
.daily-primary { padding:.85rem 1.4rem; max-width:100%; text-align:center; line-height:1.35; white-space:normal; display:inline-flex; align-items:center; justify-content:center; gap:.85rem; min-height:50px; text-decoration:none; background:#1d5a46; border-color:#1d5a46; color:#fff!important; font-weight:700; border-radius:.75rem; }
.daily-card-icon { width:110px; aspect-ratio:1; border:1px solid #c3d8c1; border-radius:1.4rem; padding:1.3rem; background:#ffffffa8; transform:rotate(4deg); }
.daily-card-icon svg { width:100%; height:100%; stroke:#6e9870; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
.daily-counts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin:0; padding-top:1rem; border-top:1px solid #cdddcc; }
.daily-counts>div { display:flex; align-items:center; justify-content:space-between; gap:.9rem; min-width:0; background:#ffffffbd; border:1px solid #d7e4d3; border-radius:.8rem; padding:1rem 1.2rem; }
.daily-counts dt { color:#42604b; font-size:.95rem; font-weight:600; }
.daily-counts dd { color:#1d563b; font-size:1.9rem; font-weight:750; line-height:1; margin:0; font-variant-numeric:tabular-nums; }
.daily-clock-note { color:#5f7365; font-size:.83rem; margin:1.05rem 0 0; }
.daily-account-note,.daily-archive { border:1px solid #dbe5d8; border-radius:1rem; padding:clamp(1.2rem,3vw,1.8rem); background:#fff; margin:0 0 1.6rem; }
.daily-account-note h2,.daily-archive h2 { font-size:1.4rem; margin:0 0 .65rem; }
.daily-account-note p,.daily-archive>p { max-width:65ch; color:#566b5d; font-size:1rem; }
.daily-actions { display:flex; gap:.75rem; align-items:center; flex-wrap:wrap; margin-top:1.1rem; }
.daily-archive input { display:block; padding:.65rem .8rem; margin:.5rem 0 1rem; font:inherit; border:1px solid #a8c3b2; border-radius:.65rem; min-height:46px; max-width:100%; }
.archive-days { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr)); gap:1rem; margin-top:1.4rem; }
.archive-day { min-width:0; display:flex; flex-direction:column; gap:.7rem; border:1px solid #dbe4d8; border-radius:.85rem; padding:1.2rem; background:#fbfcf9; }
.archive-day time { font-size:.87rem; color:#596f5f; }
.archive-day h3 { font-size:1.12rem; margin:0; color:#234b34; }
.archive-day a { min-height:44px; display:flex; align-items:center; font-weight:700; color:#1d5a46; text-underline-offset:3px; }
.archive-state { align-self:flex-start; font-size:.8rem; font-weight:650; border-radius:100px; background:#eaf2e5; color:#3a6647; padding:.25rem .6rem; }
.daily-loading { display:flex; gap:.8rem; align-items:center; padding:1.4rem; border:1px solid #d8e4d6; background:#fff; border-radius:1rem; color:#3f6048; min-height:90px; }
.daily-error { display:flex; flex-wrap:wrap; gap:.8rem; align-items:center; justify-content:space-between; }
.daily-error p { margin:0; max-width:65ch; }
.daily-error button { margin:0; }
.daily-empty-state { padding:1rem; background:#fff9e8; border:1px solid #e2d5a9; border-radius:.75rem; }
.hint-modal .modal-dialog { max-width:480px; margin:1rem auto; }
.hint-modal .modal-content { border:1px solid #d8e4d5; border-radius:1.25rem; box-shadow:0 24px 80px #12302333; overflow:hidden; color:#243d2e; }
.hint-modal .modal-header { border:0; padding:1.4rem 1.4rem .5rem; align-items:flex-start; }
.hint-heading { display:flex; align-items:center; gap:.85rem; min-width:0; }
.hint-icon { flex:0 0 46px; width:46px; height:46px; display:grid; place-items:center; background:#ecf4e6; border-radius:.85rem; }
.hint-icon svg { width:27px; height:27px; stroke:#487846; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.hint-modal .modal-title { font-size:1.4rem; line-height:1.3; font-weight:700; margin:0; }
.hint-modal .btn-close { min-width:44px; min-height:44px; padding:.5rem; margin:-.35rem -.5rem 0 .25rem; border-radius:50%; }
.hint-modal .modal-body { padding:.85rem 1.4rem 1.3rem; }
.hint-modal .modal-body p { font-size:1.05rem; line-height:1.65; color:#526957; margin:1rem 0 0; }
.hint-modal .modal-footer { border-color:#e5ede0; padding:1rem 1.4rem 1.4rem; gap:.5rem; justify-content:flex-end; background:#fafcf7; }
.hint-modal .modal-footer .btn { margin:0; min-height:48px; }
.modal-backdrop.show { opacity:.48; }
.grid-square,.grid-frame,.current-grid-clue { scroll-margin-top:6rem; }
.daily-hero { display:grid; grid-template-columns:minmax(0,1fr) 190px; gap:2rem; padding:clamp(1.6rem,4vw,3rem); border-radius:1.3rem; background:linear-gradient(125deg,#edf5e5,#f6f9ef); border:1px solid #ccdeca; align-items:center; }
.daily-hero h1 { font-size:clamp(2rem,4vw,3.4rem); max-width:16ch; line-height:1.12; color:#193f2c; margin:.8rem 0; }
.daily-hero p { font-size:1.1rem; max-width:48ch; line-height:1.75; color:#506951; }
.daily-decoration { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; transform:rotate(-4deg); }
.daily-decoration span { aspect-ratio:1; display:grid; place-items:center; background:#fff; color:#285d42; border:1px solid #c6d7c0; border-radius:7px; font-size:1.8rem; font-weight:700; }
.daily-decoration .dark { background:#285443; }
.daily-benefits { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin-top:1.5rem; }
.daily-benefits article { padding:1.5rem; background:#fff; border:1px solid #dce6d8; border-radius:1rem; }
.daily-benefits h2 { font-size:1.2rem; margin:.75rem 0; }
.daily-benefits p { line-height:1.7; color:#596f5c; font-size:.98rem; }
.daily-step { font-weight:700; color:#708b5f; }
@media(max-width:760px) {
 .daily-hero { grid-template-columns:1fr; }.daily-decoration { display:none; }.daily-benefits { grid-template-columns:1fr; }
 .daily-notice-content { grid-template-columns:1fr; }.daily-card-icon { display:none; }
 .daily-counts { gap:.7rem; }.daily-counts>div { flex-direction:column; align-items:flex-start; padding:.9rem; }.daily-counts dd { order:-1; font-size:1.75rem; }
 .daily-actions .btn,.daily-primary { width:100%; }.hint-modal .modal-dialog { margin:.75rem; }.hint-modal .modal-footer { flex-direction:column-reverse; align-items:stretch; }.hint-modal .modal-footer .btn { width:100%; }
 .hint-modal .modal-title { font-size:1.2rem; }.hint-modal .modal-header,.hint-modal .modal-body { padding-left:1.2rem; padding-right:1.2rem; }
}
@media(prefers-reduced-motion:reduce) { .daily-decoration,.daily-card-icon { transform:none; }.daily-loading .spinner-border { animation:none; } }

.client-startup { max-width:920px; margin:1rem auto; flex-wrap:wrap; }
.client-startup .btn { margin-left:auto; }
.client-startup[hidden] { display:none!important; }

.daily-primary>span:first-child { min-width:0; }
.daily-primary>span[aria-hidden] { flex:0 0 auto; font-size:1.25em; line-height:1; }
.daily-primary:hover { background:#144431; border-color:#144431; color:#fff; }
.daily-primary:focus-visible { outline:3px solid #bd7e28; outline-offset:4px; }
.daily-secondary { min-height:48px; }
.daily-sign-in { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:.55rem .8rem; font-weight:650; text-decoration:none; text-underline-offset:3px; border-radius:.6rem; }
.daily-sign-in:hover { text-decoration:underline; background:#e8f1e3; }
.daily-home .daily-actions { column-gap:.85rem; row-gap:.75rem; }
@media(max-width:760px) { .daily-home .daily-sign-in { width:100%; text-align:center; } }

/* One gentle home-only entrance: 1.25s + 0.60s maximum stagger, then still. */
@media (prefers-reduced-motion:no-preference) and (min-width:761px) {
 .daily-home .daily-decoration>span { animation:home-tile-settle 1.25s cubic-bezier(.2,.8,.2,1) both; transform-origin:50% 65%; }
 .daily-home .daily-decoration>span:nth-child(1) { animation-delay:0s; }
 .daily-home .daily-decoration>span:nth-child(2) { animation-delay:.075s; }
 .daily-home .daily-decoration>span:nth-child(3) { animation-delay:.15s; }
 .daily-home .daily-decoration>span:nth-child(4) { animation-delay:.225s; }
 .daily-home .daily-decoration>span:nth-child(5) { animation-delay:.3s; }
 .daily-home .daily-decoration>span:nth-child(6) { animation-delay:.375s; }
 .daily-home .daily-decoration>span:nth-child(7) { animation-delay:.45s; }
 .daily-home .daily-decoration>span:nth-child(8) { animation-delay:.525s; }
 .daily-home .daily-decoration>span:nth-child(9) { animation-delay:.6s; }
}
@keyframes home-tile-settle {
 0% { opacity:1; transform:translateY(12px) rotate(-8deg) scale(.95); }
 65% { opacity:1; transform:translateY(-3px) rotate(2deg) scale(1.015); }
 100% { opacity:1; transform:translateY(0) rotate(0) scale(1); }
}
@media (prefers-reduced-motion:reduce) {
 .daily-home .daily-decoration>span { animation:none; transform:none; opacity:1; }
}