/* Letter resources are local to this feature; account/login/payment chrome keeps its rules. */
.letters-hub{--letters-ink:#f6edda;--letters-gold:#e2c58e;--letters-line:#ab90604d;isolation:isolate;position:relative;margin:0 0 28px;padding:32px 30px 28px;border:1px solid #a58c5b6b;border-radius:22px;background:#101c2e url('/welcome/assets/letter-hub-v1/background-v1.webp?v=20261003-letter-hub-v1-r2') center/cover no-repeat;color:var(--letters-ink);scroll-margin-top:20px;overflow-wrap:anywhere;}
.letters-heading{margin:0 0 24px;position:relative;}
.letters-kicker,.letters-hub .letters-kicker{font:500 12px/1.6 system-ui,sans-serif;color:#e2c58e;margin:0 0 7px;letter-spacing:.025em;}
.letters-hub h2{font:400 29px/1.45 AccountMaruBuri,'MaruBuri',serif;margin:0 0 9px;color:#fff1d8;letter-spacing:-.035em;}
.letters-heading>p:last-child{font-size:14px;line-height:1.7;color:#d1d6df;margin:0;word-break:keep-all;}
/* 오늘의 운세(2026-10-15) — 허브 머리의 오늘 줄들: 금빛 테에 큰 글. 날짜가 제목이다. */
.letters-today{margin:0 0 14px;padding:16px 18px;border:1px solid var(--letters-gold);border-radius:12px;background:#ffffff0d;}
.letters-today p{margin:0;font-size:16px;line-height:1.75;color:var(--letters-ink);word-break:keep-all;}
.letters-today p+p{margin-top:8px;}
html[lang=ja] .letters-today p{word-break:normal;line-break:strict;}
.letters-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.letters-cards.letters-two{grid-template-columns:repeat(2,minmax(0,1fr));}
.letters-card{display:flex;flex-direction:column;min-width:0;padding:22px 18px 18px;border:1px solid #dfcb9e;border-radius:16px;background:linear-gradient(145deg,#fbf5e8,#ede3d0);color:#293344;}
.letters-icon{width:54px;height:54px;object-fit:contain;flex:none;pointer-events:none;}
.letters-card>.letters-icon{margin:0 0 12px;}
.letters-card h3{font:600 21px/1.5 AccountMaruBuri,'MaruBuri',serif;color:#253145;margin:0 0 10px;letter-spacing:-.035em;word-break:keep-all;}
.letters-card-copy{font-size:14px;line-height:1.75;color:#535b66;margin:0 0 18px;word-break:keep-all;}
.letters-facts{margin:0 0 16px;display:grid;gap:7px;}
.letters-facts>div{display:grid;grid-template-columns:32px minmax(0,1fr);gap:7px;align-items:baseline;}
.letters-facts dt{color:#697078;font-size:12px;line-height:1.65;}
.letters-facts dd{margin:0;color:#303b4b;font-size:13px;line-height:1.65;word-break:keep-all;}
html[lang=ja] .letters-facts>div{grid-template-columns:64px minmax(0,1fr);}
html[lang=ja] :is(.letters-card h3,.letters-card-copy,.letters-facts dd,.letters-card-status,.letters-heading>p:last-child){word-break:normal;line-break:strict;}
.letters-card-action{margin-top:auto;border-top:1px solid #cabb9d;padding-top:13px;}
.letters-card-status{color:#626b70;font-size:12px;line-height:1.7;margin:0 0 10px;word-break:keep-all;}
.letters-button,.letters-hub button.letters-button,.letters-dialog button.letters-button,.letters-ready .letters-open .nb-button,.nb-dialog .nb-button{display:inline-flex;justify-content:center;align-items:center;gap:7px;box-sizing:border-box;min-width:0;min-height:48px;max-width:100%;padding:2px 8px;border:12px solid transparent;border-left-width:14px;border-right-width:14px;border-image:url('/welcome/assets/letter-hub-v1/button-primary.svg?v=20261003-letter-hub-v1-r2') 24 28 fill/12px 14px/0 stretch;background:transparent;color:#f7ecd5;font:600 14px/1.5 system-ui,-apple-system,'Malgun Gothic',sans-serif;text-align:center;text-decoration:none;cursor:pointer;touch-action:manipulation;border-radius:12px;transition:filter .12s;white-space:normal;word-break:keep-all;}
.letters-hub .letters-button{width:100%;}
.letters-button:hover,.letters-dialog .letters-button:hover,.letters-ready .letters-open .nb-button:hover,.nb-dialog .nb-button:hover{border-image-source:url('/welcome/assets/letter-hub-v1/button-hover.svg?v=20261003-letter-hub-v1-r2');filter:none;}
.letters-button:active,.letters-dialog .letters-button:active,.letters-ready .letters-open .nb-button:active,.nb-dialog .nb-button:active{border-image-source:url('/welcome/assets/letter-hub-v1/button-pressed.svg?v=20261003-letter-hub-v1-r2');}
.letters-button:focus-visible,.letters-dialog input:focus-visible,.nb-dialog .nb-button:focus-visible{outline:2px solid #a58548;outline-offset:3px;}
.letters-button:disabled{opacity:.52;cursor:default;}
.letters-secondary,.letters-hub button.letters-secondary,.letters-dialog button.letters-secondary,.letters-ready .letters-open .nb-button.nb-quiet,.nb-dialog .nb-button.nb-quiet{border-image-source:url('/welcome/assets/letter-hub-v1/button-secondary.svg?v=20261003-letter-hub-v1-r2');font-weight:500;}
.letters-card-action>.letters-secondary{margin-top:8px;min-height:43px;font-size:12px;}
.letters-receive{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:22px;padding:15px 18px;border:1px solid var(--letters-line);border-radius:12px;background:#142237e8;}
.letters-receive>.letters-icon{width:36px;height:36px;}
.letters-receive>div{flex:1;min-width:170px;}
.letters-receive strong{font-size:14px;font-weight:600;color:#eee3ca;}
.letters-receive p{font-size:12px;color:#bdc6d1;margin:3px 0 0;line-height:1.7;}
.letters-receive>.letters-button{width:auto;flex:none;}
.letters-inbox{margin-top:23px;}
.letters-inbox h3{font:600 16px/1.5 system-ui,sans-serif;color:#efe2c6;margin:0 0 10px;}
.letters-inbox p{font-size:14px;color:#bdc6d1;margin:0;}
.letters-inbox>.letters-button{justify-content:flex-start;margin:4px 0;font-size:14px;text-align:left;}
#signed-in.letters-ready>:is(#notebook,#friday,#today-line-card,#push-card,#news-card):not(.letters-open){display:none!important;}
.letters-open{scroll-margin-top:18px;}
.letters-back{margin-bottom:12px;}
.letters-dialog{box-sizing:border-box;width:min(560px,calc(100% - 24px));max-height:calc(100dvh - 24px);overflow-y:auto;margin:auto;padding:25px;border:1px solid #bd9f68;border-radius:20px;background:#111e31;color:#f2e9d5;box-shadow:0 20px 60px #0009;font:400 15px/1.7 system-ui,-apple-system,'Malgun Gothic',sans-serif;}
.letters-dialog::backdrop{background:#050a15c9;}
.letters-dialog h2{font:400 24px/1.5 AccountMaruBuri,'MaruBuri',serif;margin:4px 0 12px;color:#fff1d9;letter-spacing:-.035em;word-break:keep-all;}
.letters-dialog-lead{color:#c9d0da;font-size:14px;line-height:1.8;margin:0 0 18px;word-break:keep-all;}
.letters-dialog>.letters-button{width:100%;margin-top:10px;}
.letters-month{background:#f1e6d0;color:#293447;padding:18px 20px;border-radius:12px;margin-bottom:16px;}
.letters-month strong{font-size:19px;line-height:1.6;color:#705329;word-break:keep-all;}
.letters-month p{font-size:14px;line-height:1.8;color:#46505d;margin:8px 0 0;word-break:keep-all;}
.letters-choice{display:flex;align-items:flex-start;gap:10px;padding:16px 14px;margin:12px 0;border:1px solid #526076;border-radius:12px;cursor:pointer;background:#18263a;}
.letters-choice:has(input:checked){border-color:#d6b67b;}
.letters-choice input{width:20px;height:20px;margin:8px 0 0;flex:none;accent-color:#dfbf81;}
.letters-choice .letters-icon{width:36px;height:36px;}
.letters-choice span{min-width:0;}
.letters-choice strong{display:block;font-size:15px;color:#efe6d3;}
.letters-choice small{display:block;font-size:12px;color:#b9c6d6;line-height:1.75;overflow-wrap:anywhere;}
.letters-save-status{color:#e2c58e;font-size:14px;line-height:1.8;word-break:keep-all;}
.nb-dialog{border-color:#bd9f68;border-radius:20px;background:#111e31;}
.nb-dialog .nb-add-form label{display:grid;gap:8px;width:100%;font-size:15px;margin:7px 0;}
.nb-dialog .nb-add-form label input{width:100%;min-height:48px;font-size:16px;}
.nb-dialog .nb-add-form>.nb-button{width:100%;margin-top:12px;}
.nb-dialog .nb-lead,.nb-dialog .nb-channel{font-size:14px;}
.nb-dialog .nb-pair .nb-button{padding:1px 6px;line-height:1.4;}
@media(max-width:900px){.letters-hub{padding:27px 22px;}.letters-cards{gap:12px;}.letters-card{padding:19px 15px;}.letters-card h3{font-size:20px;}.letters-facts>div{grid-template-columns:28px minmax(0,1fr);gap:5px;}}
@media(max-width:719px){.letters-cards{grid-template-columns:1fr;gap:15px;}.letters-hub{padding:25px 18px 24px;border-radius:18px;}.letters-card{padding:21px 20px;}.letters-card h3{font-size:23px;}.letters-card>.letters-icon{width:52px;height:52px;margin-bottom:9px;}.letters-card-copy{margin-bottom:16px;}.letters-receive{padding:15px 14px;}.letters-receive>.letters-button{width:100%;}.letters-heading>p:last-child{font-size:14px;}.letters-dialog{padding:22px 18px;}.letters-choice{padding:14px 12px;gap:8px;}}
@media(max-width:359px){.letters-hub{padding-left:13px;padding-right:13px;}.letters-card{padding:19px 15px;}.letters-card h3{font-size:21px;}.letters-receive>div{min-width:130px;}.letters-dialog{padding:20px 15px;}.letters-choice .letters-icon{display:none;}}
@media(prefers-reduced-motion:reduce){.letters-button{transition:none;}}
@media(max-width:719px){.letters-cards.letters-two{grid-template-columns:1fr;}}
/* 클로틸다의 달력(2026-10-13) — 카드 세 장 자리. 표시는 글리프와 색뿐(새 그림 없음). */
.letters-calendar{margin:0;padding:16px 14px 14px;border:1px solid #dfcb9e;border-radius:16px;background:linear-gradient(145deg,#fbf5e8,#ede3d0);color:#293344;}
.cal-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px;}
.cal-title{font:600 19px/1.4 AccountMaruBuri,'MaruBuri',serif;margin:0;color:#253145;letter-spacing:-.02em;}
.cal-nav{min-width:44px;min-height:40px;border:1px solid #cabb9d;border-radius:12px;background:#fffaf0;color:#253145;font:500 20px/1 system-ui,sans-serif;cursor:pointer;}
.cal-nav:disabled{opacity:.3;cursor:default;}
.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;}
.cal-dow{font:500 12px/1.6 system-ui,sans-serif;text-align:center;color:#697078;}
.cal-dow.cal-sun,.cal-day.cal-sun .cal-num{color:#b5523b;}
.cal-dow.cal-sat,.cal-day.cal-sat .cal-num{color:#3c6a9e;}
.cal-day{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0;min-height:50px;padding:6px 0 4px;border:1.5px solid transparent;border-radius:10px;background:#fffdf7;color:#293344;font:500 14px/1.2 system-ui,-apple-system,'Malgun Gothic',sans-serif;cursor:pointer;touch-action:manipulation;}
.cal-day.cal-past{background:transparent;}
.cal-day.cal-past .cal-num{opacity:.45;}
.cal-day.cal-today{border-color:#a58548;}
.cal-day.cal-selected{background:#152238;border-color:#152238;}
.cal-day.cal-selected .cal-num{color:#f7ecd5;opacity:1;}
.cal-day:focus-visible,.cal-nav:focus-visible,.cal-legend-item:focus-visible{outline:2px solid #a58548;outline-offset:2px;}
.cal-marks{display:flex;justify-content:center;gap:1px;min-height:11px;font:400 10px/11px system-ui,sans-serif;}
.cal-mark{font-style:normal;}
.cal-letter{color:#9a4a26;}.cal-ask{color:#9a7428;}.cal-friday{color:#35608f;}.cal-today{color:#c4891a;}.cal-note{color:#697078;}
.cal-selected .cal-mark{color:#f2d99e;}
.cal-day-panel{margin-top:12px;padding-top:12px;border-top:1px solid #cabb9d;}
.cal-day-panel h4{font:600 15px/1.5 system-ui,sans-serif;color:#253145;margin:0 0 6px;}
.cal-row{display:grid;grid-template-columns:18px minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 0;}
.cal-row+.cal-row{border-top:1px dashed #d8c9a8;}
.cal-row>.cal-mark{font-size:13px;text-align:center;}
.cal-row-text strong{display:block;font-size:14px;color:#253145;word-break:keep-all;}
.cal-row-text p{margin:2px 0 0;font-size:13px;line-height:1.6;color:#535b66;word-break:keep-all;}
.letters-calendar .cal-row .letters-button{width:auto;min-height:40px;font-size:13px;padding:0 4px;}
.letters-calendar .cal-add{margin-top:6px;}
.letters-calendar .cal-add .letters-button{width:100%;}
.cal-empty{margin:4px 0;font-size:13px;color:#697078;}
.cal-legend{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:12px;}
.cal-legend-item{display:inline-flex;align-items:center;gap:5px;min-height:32px;padding:0 4px;border:0;background:none;color:#535b66;font:500 12px/1.4 system-ui,sans-serif;cursor:pointer;}
.cal-hint{display:block;margin:10px 0 0;font-size:13px;color:#7a5a24;text-decoration:underline;text-underline-offset:3px;}
html[lang=ja] :is(.cal-row-text strong,.cal-row-text p){word-break:normal;line-break:strict;}
@media(max-width:359px){.letters-calendar{padding:12px 8px;}.cal-grid{gap:2px;}.cal-day{min-height:46px;font-size:13px;}.cal-row{grid-template-columns:16px minmax(0,1fr);}.letters-calendar .cal-row .letters-button{grid-column:2;justify-self:start;}}