.frugal-page{background:var(--paper,#f8f7f2);color:var(--ink,#242720)}.frugal-shell{max-width:880px;margin:auto;padding:32px 24px 64px}.frugal-shell header{margin-bottom:28px}.frugal-shell header h1{font-size:clamp(26px,5vw,38px);margin:8px 0}.frugal-eyebrow{margin-top:30px;color:var(--muted);font-size:13px}.frugal-shell footer{margin-top:32px;color:var(--muted);font-size:13px;line-height:1.7}.frugal-shell .card{padding:24px;margin:18px 0;overflow-wrap:anywhere}.frugal-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:16px 0}.frugal-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.frugal-shell label{display:block;margin:12px 0 6px;font-weight:600}.frugal-shell input,.frugal-shell textarea,.frugal-shell select{width:100%;max-width:100%;padding:12px;border:1px solid var(--line);border-radius:10px;background:white;font:inherit;box-sizing:border-box}.frugal-shell textarea{min-height:86px;resize:vertical}.frugal-shell button{min-height:44px}.frugal-shell .consent{display:flex;align-items:flex-start;gap:10px;line-height:1.6;font-size:14px}.frugal-shell .consent input{width:20px;height:20px;flex-shrink:0;margin-top:2px}.frugal-rules{padding:16px;background:var(--wash);border-radius:12px;line-height:1.8}.frugal-members{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}.frugal-member{padding:16px;border:1px solid var(--line);border-radius:12px}.frugal-member h3{margin:0 0 10px}.frugal-member details{margin-top:12px}.frugal-member summary{cursor:pointer;min-height:44px;padding:10px 0}.frugal-checkin{border-top:1px solid var(--line);padding:12px 0}.frugal-checkin p{margin:6px 0;white-space:pre-wrap}.frugal-post{padding:18px 0;border-top:1px solid var(--line)}.frugal-post p{white-space:pre-wrap;overflow-wrap:anywhere}.frugal-reactions{display:flex;gap:8px;flex-wrap:wrap}.frugal-reactions button{font-size:12px;border:1px solid var(--line);border-radius:20px;background:white;padding:8px 12px}.frugal-reactions [aria-pressed=true]{background:var(--accent-soft);border-color:var(--ink)}.frugal-code{display:block;font-family:monospace;overflow-wrap:anywhere;padding:16px;background:var(--wash);user-select:all}.frugal-shell progress{width:100%;accent-color:var(--ink)}.frugal-shell #room-message:not(:empty){padding:14px;background:#fff0cc;border-radius:12px;margin-bottom:16px}.frugal-shell .form-help{line-height:1.7}.frugal-shell h2{font-size:21px}.frugal-shell small{color:var(--muted)}@media(max-width:600px){.frugal-shell{padding:22px 16px 48px}.frugal-shell .card{padding:18px}.frugal-grid{grid-template-columns:1fr}.frugal-actions>.button{flex-grow:1}.frugal-shell input,.frugal-shell textarea,.frugal-shell select{font-size:16px}}

.frugal-link{width:100%;margin:6px 0 10px;font:inherit;font-size:14px}.frugal-code-detail{margin-top:12px}.frugal-code-detail summary{min-height:44px;display:flex;align-items:center;cursor:pointer}

/* Today first, then the period as cells. A dot means filled and a ring means
   kept within the limit, so the states differ in shape as well as colour; the
   lines that carry them clear 3:1 on white. Open days past and future share one
   look and only today carries an outer ring, so the grid never shows a broken run. */
.frugal-page{--day-line:#8d9387;--filled:#f6e7a0;--filled-line:#8a7420;--toggle-line:#b9bdb2}
.frugal-shell .card.frugal-today{box-shadow:inset 0 0 0 2px var(--ink)}.frugal-today h2:focus{outline:none}.frugal-today>.form-help{margin-top:4px}.frugal-together{margin:8px 0 0;font-weight:600}
.frugal-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;max-width:252px;margin:14px 0 6px}
.frugal-day{display:grid;place-items:center;aspect-ratio:1;border-radius:7px;box-shadow:inset 0 0 0 1px var(--day-line);background:white}
.frugal-day.is-filled,.frugal-day.is-kept{background:var(--filled);box-shadow:inset 0 0 0 1px var(--filled-line)}
.frugal-day.is-kept{background:var(--accent);box-shadow:inset 0 0 0 2px var(--ink)}
.frugal-day.is-filled::after,.frugal-day.is-kept::after{content:'';width:30%;aspect-ratio:1;border-radius:50%;background:var(--ink)}
.frugal-day.is-today{outline:2px solid var(--ink);outline-offset:1px}
.frugal-day.is-saved{animation:frugal-saved .9s ease-out}
@keyframes frugal-saved{from{transform:scale(1.3)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.frugal-day.is-saved{animation:none}}
.frugal-member .frugal-days{max-width:196px;gap:4px}.frugal-member .frugal-day{border-radius:5px}
.frugal-legend{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0;color:var(--muted);font-size:13px}.frugal-legend>span{display:inline-flex;align-items:center;gap:6px}.frugal-legend .frugal-day{width:1.1em;border-radius:4px}
.frugal-kept{margin:10px 0 0;font-size:17px}.frugal-kept strong{font-weight:600}.frugal-fix{margin-top:14px}
/* These summaries are flex rows, which drops the native marker, so they draw one. */
/* Every disclosure on the page uses the same chevron, so a card does not mix a
   left triangle (지난 인증) with a right chevron (신고·차단). */
:is(.frugal-fix,.frugal-more,.frugal-done,.frugal-compose,.frugal-code-detail,.frugal-management,.frugal-member details)>summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:8px;font-weight:600;list-style:none}
:is(.frugal-fix,.frugal-more,.frugal-done,.frugal-compose,.frugal-code-detail,.frugal-management,.frugal-member details)>summary::-webkit-details-marker{display:none}
:is(.frugal-fix,.frugal-more,.frugal-done,.frugal-compose,.frugal-code-detail,.frugal-management,.frugal-member details)>summary::after{content:'';flex:none;width:7px;height:7px;margin:0 4px 3px auto;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
:is(.frugal-fix,.frugal-more,.frugal-done,.frugal-compose,.frugal-code-detail,.frugal-management,.frugal-member details)[open]>summary::after{margin-bottom:-3px;transform:rotate(-135deg)}
.frugal-more summary{font-size:13px;color:var(--muted)}
.frugal-badge{display:inline-block;margin-left:4px;padding:2px 8px;border-radius:999px;background:var(--accent-soft);font-size:12px;font-weight:600;vertical-align:middle}
/* One look for every toggle on this page, at the 44px touch size: soft yellow,
   an ink line and a check when pressed. The yellow fill stays for main actions. */
.frugal-reactions button,.frugal-five,.frugal-outcome button,.frugal-chip{min-height:44px;border:1px solid var(--toggle-line);border-radius:999px;background:white;padding:8px 14px;font:inherit;font-size:13px;font-weight:400;color:var(--ink);cursor:pointer}
:is(.frugal-reactions button,.frugal-five,.frugal-outcome button,.frugal-chip)[aria-pressed=true]{background:var(--accent-soft);border-color:var(--ink);font-weight:600}
:is(.frugal-reactions button,.frugal-five,.frugal-outcome button,.frugal-chip)[aria-pressed=true]::before{content:'✓ ';content:'✓ ' / ''}
.frugal-cheers{font-weight:600}.frugal-list-status{margin:12px 0 0;font-weight:600}.frugal-join-note{padding:12px 14px;border-radius:12px;background:var(--accent-soft);line-height:1.6}
.frugal-presets{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 0}
.frugal-ask textarea{min-height:64px}.frugal-outcome{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:4px 0 10px;font-size:13px;color:var(--muted)}.frugal-outcome-note{font-size:13px;font-weight:600}
.frugal-done{margin:18px 0}.frugal-done>summary{padding:0 4px}
.frugal-hidden-reactions{padding:18px 0;border-top:1px solid var(--line)}.frugal-hidden-reactions .form-help{margin:0 0 10px}
