/* Warm Ink + Living Teal: readable mobile tools, with device text scaling intact. */
@font-face { font-family: "RIDIBatang"; src: url("/app/RIDIBatang.otf") format("opentype"); font-style: normal; font-weight: 400; font-display: swap; }
:root, [data-theme="onseum-default"] { color-scheme:light; --bg:#F6F5F0; --card:#FFFFFF; --fg:#202925; --muted:#59645F; --line:#D8DED8; --primary:#196B59; --primary-fg:#FFFFFF; --ok:#196B59; --danger:#A63232; --green:#E6F1E9; --apricot:#F9EBDD; --lilac:#ECE9F5; --radius:14px; }
* { box-sizing:border-box; }
/* Follow browser text preferences and native text scaling where supported. */
html { font-size:100%; -webkit-text-size-adjust:auto; text-size-adjust:auto; }
@supports (font: -apple-system-body) {
  html { font: -apple-system-body; }
}
body { margin:0; background:var(--bg); color:var(--fg); font-family:"RIDIBatang","Apple SD Gothic Neo","Malgun Gothic",serif; font-size:1rem; line-height:1.5; }
a { color:var(--primary); text-underline-offset:3px; }
.app { max-width:480px; min-height:100vh; min-height:100dvh; margin:auto; display:flex; flex-direction:column; }
.topbar { position:sticky; top:0; z-index:3; background:var(--bg); border-bottom:1px solid var(--line); padding:.625rem 1rem; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.25rem .75rem; }
.topbar h1 { margin:0; min-width:0; font-size:1.25rem; font-weight:400; line-height:1.3; letter-spacing:-.04em; overflow-wrap:anywhere; }
.conn { font-size:.8125rem; color:var(--muted); overflow-wrap:anywhere; }
.conn.ok { color:var(--ok); } .conn.bad { color:var(--danger); }
.view { flex:1; padding:1rem; overflow-wrap:anywhere; }
.view > .badge { margin-bottom:.75rem; }
.card { border:1px solid var(--line); background:var(--card); border-radius:var(--radius); padding:1rem; margin-bottom:.75rem; }
.card h2 { margin:0 0 .75rem; font-size:1.125rem; line-height:1.3; letter-spacing:-.025em; font-weight:400; }
.card h3 { font-size:1rem; line-height:1.4; }
.card p { margin:.5rem 0; }
.card > h2:first-child { padding-bottom:.625rem; border-bottom:1px solid var(--line); }
.note { color:var(--muted); font-size:.875rem; line-height:1.5; }
label { display:block; margin-bottom:.75rem; font-size:.875rem; font-weight:400; }
.password-field { margin-bottom:.75rem; }
.password-field > label { margin-bottom:0; }
.password-control { display:flex; align-items:center; gap:.5rem; }
.password-control input { flex:1; min-width:0; }
.password-control button { flex:0 0 auto; margin-top:.375rem; }
input,select,textarea { width:100%; max-width:100%; min-width:0; min-height:44px; margin-top:.375rem; padding:.625rem .75rem; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--fg); font:inherit; font-size:1rem; }
input::placeholder,textarea::placeholder { color:var(--muted); }
input:focus,select:focus,textarea:focus { border-color:var(--primary); }
input[type=file] { font-size:.875rem; padding:.5rem; }
textarea { resize:vertical; }
button { min-width:44px; min-height:44px; max-width:100%; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--fg); padding:.625rem .75rem; font:inherit; font-size:.875rem; font-weight:400; cursor:pointer; overflow-wrap:anywhere; white-space:normal; }
button:hover:not(:disabled) { border-color:var(--primary); background:var(--green); }
button.btn { width:100%; background:var(--primary); color:var(--primary-fg); border-color:var(--primary); font-size:1rem; font-weight:400; }
button.btn:hover:not(:disabled) { background:#135443; color:#fff; }
button:disabled { opacity:.5; cursor:default; }
.row { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.375rem .75rem; padding:.5rem 0; }
.row + .row { border-top:1px solid var(--line); }
.row > * { min-width:0; overflow-wrap:anywhere; }
.row > span:first-child { flex:1 1 45%; }
.row .del { flex:0 0 auto; }
.del { min-width:44px; min-height:44px; background:transparent; color:var(--danger); border-color:transparent; font-size:.875rem; text-decoration:underline; text-underline-offset:3px; }
.err { padding:.75rem; margin-bottom:.75rem; border:1px solid var(--danger); border-radius:10px; background:#FFF5F2; color:var(--danger); font-size:.875rem; font-weight:400; }
.badge { display:inline-block; padding:.25rem .5rem; border-radius:6px; font-size:.8125rem; line-height:1.4; font-weight:400; }
.badge.local { color:var(--muted); background:#ECEDE8; }
.badge.server { color:var(--primary); background:var(--green); }
.amt-in { color:var(--primary); font-weight:400; font-variant-numeric:tabular-nums; }
.amt-out { color:var(--danger); font-weight:400; font-variant-numeric:tabular-nums; }
.grid2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.5rem; }
.grid2 a { min-height:44px; display:flex; align-items:center; justify-content:center; gap:.5rem; padding:.75rem; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--fg); font-size:.875rem; font-weight:400; text-decoration:none; overflow-wrap:anywhere; }
.feature-icon { flex:0 0 22px; }
.header-home { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border:1px solid var(--line); border-radius:10px; color:var(--primary); text-decoration:none; vertical-align:middle; }
.header-current { margin-left:.5rem; font-size:1.125rem; font-weight:400; letter-spacing:-.025em; vertical-align:middle; }
.tabs { position:sticky; bottom:0; z-index:3; margin-top:auto; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.125rem; padding:.375rem .375rem calc(.375rem + env(safe-area-inset-bottom,0px)); background:#fff; border-top:1px solid var(--line); }
.tabs a { min-width:0; min-height:44px; padding:.375rem .125rem; border-radius:10px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.25rem; color:var(--muted); font-size:.8125rem; font-weight:400; text-decoration:none; text-align:center; overflow-wrap:anywhere; }
.tabs a.on { background:var(--green); color:var(--primary); }
.tabs .feature-icon { width:20px; height:20px; flex-basis:20px; }
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
.home-identity { background:transparent; border:0; padding:.125rem 0 .75rem; margin-bottom:.25rem; }
.identity-eyebrow { display:block; margin-bottom:.375rem; color:var(--primary); font-size:.8125rem; font-weight:400; letter-spacing:.025em; }
.home-identity strong { font-size:1.125rem; line-height:1.45; letter-spacing:-.025em; }
.home-identity p { margin:.375rem 0; }
.home-identity .note { font-size:.8125rem; }
.home-identity-links { display:flex; flex-wrap:wrap; gap:.25rem .75rem; }
.home-identity-links a { display:inline-flex; align-items:center; min-height:44px; font-size:.8125rem; font-weight:400; }
.section-heading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:.25rem .5rem; margin-bottom:.5rem; }
.section-heading h2 { margin:0; }
.section-heading .note { font-size:.8125rem; }
.smart-summary { padding:.875rem 1rem; border:0; border-left:3px solid var(--primary); border-radius:0 14px 14px 0; background:var(--green); }
.smart-summary .section-heading h2 { font-size:.875rem; letter-spacing:0; }
.summary-date { font-size:.8125rem; color:var(--primary); font-variant-numeric:tabular-nums; }
.smart-summary p { margin:.375rem 0; font-size:.875rem; }
.smart-summary .summary-lead { font-weight:400; }
.smart-summary .summary-method { font-size:.8125rem; margin-top:.5rem; }
[aria-label="나만의 홈"] > h2 { border:0; padding:0; }
#home-shortcuts a { justify-content:flex-start; background:var(--green); border-color:#C3DACE; padding:.875rem .75rem; color:var(--primary); }
#home-shortcuts a span { min-width:0; }
#home-choice-status { margin-bottom:0; font-size:.8125rem; }
#home-editor { margin-top:.375rem; }
summary { cursor:pointer; min-height:44px; padding:.625rem 0; font-size:.875rem; font-weight:400; }
#home-editor summary { color:var(--muted); }
.home-choice-row { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.25rem; border-bottom:1px solid var(--line); padding:.375rem 0; }
.home-choice-row > span { font-size:.875rem; font-weight:400; }
#home-choice-list button { margin:.125rem; padding:.375rem .5rem; }
.home-overview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
.home-overview > .card { min-width:0; padding:.75rem; }
.home-overview h2 { font-size:.875rem; }
.home-overview .row,.home-overview > .card > div { font-size:.875rem; }
.home-overview .row { gap:.125rem .375rem; }
.home-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; margin:0 0 1rem; }
.home-actions a { min-height:44px; display:flex; align-items:center; justify-content:center; padding:.625rem .25rem; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--primary); font-size:.875rem; font-weight:400; text-decoration:none; text-align:center; overflow-wrap:anywhere; }
.function-group { padding:1rem 1rem .375rem; }
.feature-list-link { display:flex; align-items:center; gap:.75rem; padding:.75rem 0; color:var(--fg); text-decoration:none; }
.feature-list-link + .feature-list-link { border-top:1px solid var(--line); }
.feature-marker { flex:0 0 36px; width:36px; height:36px; display:flex; align-items:center; justify-content:center; border-radius:10px; background:var(--green); color:var(--primary); }
.feature-list-link[href="#learn"] .feature-marker,.feature-list-link[href="#life"] .feature-marker { background:var(--lilac); color:#514667; }
.feature-copy { min-width:0; flex:1; }
.feature-copy strong { display:block; font-size:.9375rem; font-weight:400; }
.feature-copy small { display:block; margin-top:.125rem; color:var(--muted); font-size:.8125rem; }
.feature-arrow { color:var(--muted); font-size:1rem; }
.office-group .feature-marker { background:var(--apricot); color:#785238; }
.home-more { border:1px solid var(--line); border-radius:10px; margin-bottom:.5rem; background:#fff; }
.home-more > summary { padding:.75rem; font-size:.875rem; list-style-position:inside; }
.home-more[open] > summary { border-bottom:1px solid var(--line); }
.home-more > .card { margin:0; border:0; padding:.75rem; }
.home-more > .card h2 { display:none; }
#discovery-guide .discovery-option { display:flex; align-items:flex-start; gap:.75rem; width:100%; min-height:44px; margin:0; padding:.75rem 0; font-size:.9375rem; font-weight:400; line-height:1.5; }
#discovery-guide .discovery-option + .discovery-option { border-top:1px solid var(--line); }
#discovery-guide .discovery-choice { flex:0 0 20px; width:20px; min-width:20px; min-height:20px; height:20px; margin:.125rem 0 0; padding:0; accent-color:var(--primary); }
#discovery-guide .discovery-option span { min-width:0; flex:1; overflow-wrap:anywhere; }
#discovery-guide .discovery-option:focus-within { outline:2px solid var(--primary); outline-offset:2px; border-radius:4px; }
.finance-check { display:flex; align-items:center; gap:.5rem; min-height:44px; font-weight:400; }
.finance-check input { flex:0 0 20px; width:20px; height:20px; min-height:20px; margin:0; accent-color:var(--primary); }
#finance-plan fieldset { min-width:0; margin:.75rem 0; padding:.75rem; border:1px solid var(--line); border-radius:10px; }
#finance-plan legend { font-size:.875rem; font-weight:400; padding:0 .25rem; }
#fp-save { margin-top:.5rem; }
#fp-result h3 { font-size:1rem; }
[aria-label="문서 자료실"] button { font-size:.875rem; margin:.125rem 0; }
[aria-label="문서 자료실"] > p > a { display:inline-flex; align-items:center; min-height:44px; font-weight:400; }
@media(max-width:340px) { .grid2,.home-overview { grid-template-columns:minmax(0,1fr); } }
@media(prefers-reduced-motion:no-preference) { button,a,input,select { transition:background-color .12s,border-color .12s; } }

/* The home leads with a real next action; secondary figures stay one tap away. */
.home-identity { padding:0 0 .625rem; margin:0; }
.home-identity .identity-eyebrow { margin:0 0 .25rem; font-size:.875rem; }
.home-identity .identity-agency { font-size:.8125rem; color:var(--muted); margin:.25rem 0; }
.identity-options { display:flex; align-items:center; flex-wrap:wrap; gap:.25rem; }
.identity-options a { display:inline-flex; min-height:44px; align-items:center; font-size:.8125rem; font-weight:400; }
.summary-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.5rem; margin-top:.625rem; }
.summary-actions a { display:flex; align-items:center; justify-content:center; min-height:44px; padding:.5rem; border:1px solid #B9D2C2; border-radius:10px; background:#fff; color:var(--primary); text-decoration:none; font-size:.875rem; font-weight:400; text-align:center; }
.smart-summary .summary-method { margin:.375rem 0 0; }
#home-choice-status { margin-top:.375rem; }
#home-editor summary { padding:.5rem 0; }
.home-overview-details .home-overview { padding:.75rem .75rem 0; }
.home-overview-details .home-actions { padding:0 .75rem; margin-bottom:.75rem; }

.summary-actions a:first-child { background:var(--primary); color:#fff; border-color:var(--primary); }
.feature-list-link:hover .feature-marker { outline:1px solid currentColor; outline-offset:2px; }

/* Schedule plans */
.plan-switch { display:flex; gap:.5rem; margin-bottom:1rem; }
.plan-switch button { flex:1; }
.plan-switch [aria-pressed="true"] { background:var(--primary); color:var(--primary-fg); }
#sc-month-field[hidden], #sc-year-field[hidden] { display:none; }
.plan-year-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr)); gap:.75rem; }
.plan-month { border:1px solid var(--line); border-radius:10px; padding:.625rem; }
.plan-month h3 { margin:0; }
.plan-month button { width:100%; text-align:left; color:var(--primary); }
.plan-entries { list-style:none; padding:0; margin:.375rem 0; }
.plan-entries li { padding:.375rem 0; }
.plan-entries li + li { border-top:1px solid var(--line); }
.plan-entries small { display:block; color:var(--muted); }

.plan-day { display:block; min-height:44px; padding:.2rem; border-top:1px solid var(--line); overflow-wrap:anywhere; text-decoration:none; }
.plan-day b { text-decoration:underline; }

.mood-picker { display:flex; flex-wrap:wrap; gap:.4rem; border:0; padding:0; }
.mood-picker label { display:flex; align-items:center; gap:.25rem; min-height:44px; cursor:pointer; }
.mood-picker input { min-height:0; width:auto; margin:0; }
.care-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:2px; text-align:center; }
.care-days button { min-width:0; padding:2px; }
.care-days [aria-pressed=true] { background:var(--green); border-color:var(--primary); }

/* Independently selected mood stickers, from the user-provided 4 by 5 sheet. */
.care-sticker { display:inline-block; width:80px; aspect-ratio:5/4; background-image:url("/app/mood-stickers.png"); background-size:400% 500%; background-repeat:no-repeat; vertical-align:middle; }
.care-sticker-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.5rem; }
.care-sticker-options label { display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px solid var(--line); border-radius:10px; padding:.4rem; margin:0; cursor:pointer; min-height:100px; text-align:center; font-weight:400; }
.care-sticker-options input { width:20px; min-height:20px; margin:0; }
.care-sticker-options label:has(input:checked) { background:var(--green); outline:2px solid var(--primary); }
.care-sticker-picker { border:1px solid var(--line); border-radius:10px; margin:0 0 .75rem; padding:.75rem; }
.care-days .care-sticker { width:40px; max-width:100%; }
.care-record-actions { display:flex; gap:.5rem; margin-top:.75rem; }
.care-record-actions button, .care-form-actions button { min-height:44px; padding:.5rem .875rem; }
.care-form-actions { display:flex; gap:.5rem; }
.care-form-actions .btn { width:auto; flex:1; }
@media (max-width:360px) { .care-sticker-options { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* RIDIBatang is a regular face. Keep its original strokes without synthetic bold. */
body { font-synthesis:none; }
b, strong { font-weight:400; }

/* Composite the sheet's white paper into each card and center its crop. */
.care-sticker { mix-blend-mode:multiply; }
.care-sticker-options label { display:grid; justify-items:center; align-content:center; gap:.375rem; isolation:isolate; }
.care-days button { isolation:isolate; }

/* Allow larger preferred text to reflow without fixed fieldset widths. */
fieldset { min-inline-size:0; max-inline-size:100%; }
.plan-switch { flex-wrap:wrap; }
.plan-switch button { flex-basis:8em; }


.topbar .brand-title { font-size:1.5rem; }
.topbar #brand-copy { padding:0; }


.topbar #brand-copy { margin-top:.625rem; }
.topbar #brand-copy .identity-eyebrow { margin:0; }
.topbar #brand-copy .identity-agency { margin:.0625rem 0 0; }
#todo-panel .task-option { display:flex; align-items:center; gap:.4rem; min-height:44px; }
#todo-panel .task-option input { width:1.15rem; min-height:0; height:1.15rem; margin:0; }
#todo-panel .habit-option { width:fit-content; margin:-.5rem auto 0 0; }
.task-timing { display:grid; grid-template-columns:minmax(0,8rem) minmax(0,1fr); align-items:center; gap:.65rem 1.3rem; margin:1rem 0 1.1rem; }
.task-time-label { grid-column:1 / -1; margin:0; }
.task-timing input[type="time"], .task-timing .task-option { margin:0; }
#task-reminder { position:sticky; top:0; z-index:5; }



#todo-panel #habit-help { margin:-.25rem 0 .75rem; }
#todo-panel #push-help { margin:.25rem 0 .5rem; }
#todo-panel .daily-task { display:flex; align-items:center; gap:.5rem; flex:1; min-width:0; min-height:44px; margin:0; }
#todo-panel .daily-task input { flex:0 0 1.15rem; width:1.15rem; height:1.15rem; min-height:0; padding:0; margin:0; }
#todo-panel .daily-task span { min-width:0; overflow-wrap:anywhere; }
#todo-panel .daily-task input:checked { accent-color:#b5bab7; }
#todo-panel .daily-task input:checked + span { color:#949995; text-decoration:line-through; }


#todo-panel input[type="checkbox"]:checked { appearance:none; -webkit-appearance:none; border:1px solid #717a74; border-radius:3px; background:#717a74 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 10 4 4 8-9' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat; }
#todo-panel .daily-task input:checked { background-color:#a6ada8; border-color:#a6ada8; }
.ledger-trend svg { display:block; width:100%; }
.ledger-trend .trend-axis { display:flex; justify-content:space-between; font-size:.8125rem; }
.trend-income { color:#166653; } .trend-expense { color:#ab482f; }
.ledger-trend table { width:100%; font-variant-numeric:tabular-nums; }
.ledger-trend td { text-align:right; }


#todo-panel form > button[type="submit"] { margin-top:.5rem; }


#daily-entry { margin-top:1rem; }
#daily-entry input[name="task"] { margin-top:.75rem; }
#lg-receipt { margin:.75rem 0 1rem; }

.care-letter { margin:1rem 0; padding:1rem 1.125rem; border:1px solid #d7cfdd; border-radius:12px; background:#f6f2f8; }
.care-letter small { color:#645667; }
.care-letter p { white-space:pre-wrap; line-height:1.85; }