/* Settings controls shared by Web and LINE MINI App. Scoped away from login and chat. */
.settings-page{--settings-ink:#183c51;--settings-muted:#526b79;--settings-accent:#087fa8;--settings-border:#dce7ed;color:var(--settings-ink)}
.account-panel.settings-page,.reminders-page.settings-page,.local-calendar.settings-page,.legal-page.settings-page,.mini-settings.settings-page,.mini-schedule.settings-page{max-width:820px;margin:24px auto;padding:0;border:0;background:transparent;text-align:left;box-shadow:none}
.settings-page h1{font-size:30px;line-height:1.5;letter-spacing:-.04em;margin:10px 0 16px;overflow-wrap:anywhere}.settings-page h2{font-size:20px;line-height:1.6;letter-spacing:-.02em;margin:8px 0 14px}.settings-page h3{font-size:17px;line-height:1.6}
.settings-page p,.settings-page li{font-size:14px;line-height:1.85;color:var(--settings-muted);overflow-wrap:anywhere}.settings-page p{margin:12px 0}.settings-page small{font-size:12px;line-height:1.7;color:var(--settings-muted)}
.settings-eyebrow,.settings-page .calendar-eyebrow{display:block;color:#087ba1;font-size:12px;font-weight:700;letter-spacing:.04em;margin-bottom:8px}
.settings-page>.account-face{width:56px;height:60px;margin:0 0 8px;object-fit:contain}
.settings-page :is(.settings-card,.reminder-card,.calendar-card,.memory-item,.mini-schedule-card,.mini-reminder-picker){padding:24px;background:#fff;border:1px solid var(--settings-border);border-radius:20px;box-shadow:0 4px 18px #163c5205;margin:18px 0;overflow-wrap:anywhere}
.settings-page .settings-card :is(.memory-item,.calendar-card){box-shadow:none;background:#f8fbfd;border-radius:14px;padding:18px}
.settings-card-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.settings-card-heading h2{margin:0}
.settings-page form{margin:18px 0;text-align:left}.settings-page>form{padding:24px;background:#fff;border:1px solid var(--settings-border);border-radius:20px}.settings-page form:last-child{margin-bottom:0}.settings-page fieldset{border:0;padding:0;margin:0;min-width:0}.settings-page fieldset>h2:not(:first-child){padding-top:24px;border-top:1px solid #e6edf2;margin-top:28px}
.settings-page label{display:block;font-size:14px;font-weight:600;line-height:1.7;color:#31566b;margin:18px 0 8px}.settings-page label:has(input[type=checkbox]),.settings-page label:has(input[type=radio]){display:flex;align-items:flex-start;gap:10px;background:#f4f8fb;border:1px solid #e1eaf0;border-radius:12px;padding:14px;font-weight:400}
.settings-page input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.settings-page select,.settings-page textarea{display:block;width:100%;max-width:100%;min-width:0;min-height:46px;padding:11px 12px;border:1px solid #bccfdc;border-radius:10px;background:#fff;color:var(--settings-ink);font:inherit;font-size:16px;line-height:1.5;box-sizing:border-box}.settings-page textarea{min-height:110px;resize:vertical}.settings-page input[type=checkbox],.settings-page input[type=radio]{width:19px;height:19px;flex:0 0 19px;margin:3px 0 0;padding:0;accent-color:var(--settings-accent)}
.settings-page button,.settings-page a.button,.settings-page a.settings-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:auto;max-width:100%;min-height:46px;margin:8px 8px 0 0;padding:12px 20px;border:1px solid #cddfe8;border-radius:12px;background:#fff;color:#31566b;box-shadow:none;font:inherit;font-size:14px;font-weight:700;line-height:1.5;text-align:center;text-decoration:none;cursor:pointer;white-space:normal;transition:background .15s,border-color .15s;transform:none}
.settings-page .button,.settings-page a.button{background:var(--settings-accent);border-color:var(--settings-accent);color:white}.settings-page .button:hover,.settings-page a.button:hover{background:#06698c;border-color:#06698c;transform:none}.settings-page button:not(.button):hover,.settings-page a.settings-secondary:hover{background:#edf6fb;border-color:#8bb8cc}
.settings-page .settings-danger,.settings-page .button.settings-danger{color:#a1353c;border-color:#e6c8cc;background:white}.settings-page .settings-danger:hover,.settings-page button.settings-danger:hover{background:#fff1f2;border-color:#cc8b93}.settings-page button:disabled{opacity:.5;cursor:not-allowed}.settings-page :is(button,a,summary,input,select,textarea):focus-visible{outline:3px solid #1197c4;outline-offset:3px}
.settings-page .notice,.settings-page p[role=status]{padding:16px 18px;background:#eef8fb;border:1px solid #cfe6ed;border-radius:14px;color:#31566b;font-size:13px;line-height:1.85}.settings-page .notice p{font-size:13px}.settings-page [role=alert]:not(.validation-summary-valid){color:#79521e;background:#fff4e5;border:1px solid #edcf9b;padding:14px 16px;border-radius:12px}.settings-page .form-errors.validation-summary-valid{display:none}
.settings-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;font-size:12px;font-weight:700;line-height:1.6;background:#eff3f6;color:#596b78}.settings-badge:before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex-shrink:0}.settings-badge.is-on{background:#e5f5ec;color:#236c47}.settings-badge.is-off{background:#eff3f6;color:#596b78}
.settings-page .settings-links{display:flex;flex-direction:column;gap:0}.settings-links>a{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:16px 0;border-bottom:1px solid #e6edf2;font-size:14px;color:#31566b;text-decoration:none}.settings-links>a:last-child{border-bottom:0}.settings-links>a:hover{color:#087ba1}.settings-links strong{font-size:14px}.settings-links small{display:block;font-size:13px;margin-top:4px;font-weight:400}.settings-links>a>span:last-child{font-size:24px}.settings-page a.settings-danger-link{color:#a1353c}.settings-page .settings-back{display:inline-flex;align-items:center;min-height:44px;font-size:14px}
.settings-page details>summary{cursor:pointer;font-size:14px;line-height:1.8;font-weight:600;color:#41647a;padding:8px 0;list-style:none}.settings-page details>summary::-webkit-details-marker{display:none}.settings-page details>summary:after{content:"＋";float:right;color:#087ba1;margin-left:12px}.settings-page details[open]>summary:after{content:"−"}.settings-page details[open]>summary{margin-bottom:16px}
.settings-page .settings-empty,.settings-page .calendar-empty{padding:20px;border:1px dashed #cddfe8;border-radius:16px;background:#f3f8fb;color:var(--settings-muted)}.settings-empty h2{font-size:17px}.settings-empty p{margin-bottom:0}
.settings-page dl{margin:12px 0}.settings-page dt{font-size:12px;color:var(--settings-muted);font-weight:600;margin-top:18px}.settings-page dd{font-size:15px;line-height:1.85;margin:6px 0 0;overflow-wrap:anywhere}.settings-page .reminder-summary{background:#eef8fb;border:1px solid #cfe6ed;padding:20px;border-radius:16px}
.settings-page .calendar-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:0;background:transparent;border:0}.settings-page .calendar-toolbar a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;border:1px solid #cddfe8;border-radius:12px;background:#fff;font-size:14px;color:#31566b}.settings-page .calendar-toolbar a[aria-current=page]{background:#e9f6fb;border-color:#087fa8;color:#06698c}.settings-page form.calendar-date-picker{display:flex;flex-wrap:wrap;gap:12px;align-items:end}.settings-page .calendar-date-picker label{width:100%;margin:0}.settings-page .calendar-date-picker input{width:auto;flex:1;min-width:180px}.settings-page .calendar-date-picker button{margin:0}
.settings-page .calendar-day{border:1px solid var(--settings-border);border-radius:18px;background:#fff;padding:20px}.settings-page .calendar-day h2{font-size:17px}.settings-page .calendar-event{border-radius:12px;min-height:56px}.settings-page .calendar-event:hover{background:#eaf5fb}.settings-page .local-calendar-head{gap:16px;flex-wrap:wrap}.settings-page .calendar-footnote{font-size:12px;margin-top:24px}
.settings-page .mini-settings-list{border-radius:16px;border-color:var(--settings-border)}.settings-page .mini-settings-list a{font-size:14px}.settings-page .mini-settings-legal a{min-height:36px;line-height:1.8}.settings-page .mini-reminder-options button{padding:10px 8px;margin:0;min-width:0;width:100%}.settings-page .mini-schedule-actions .button{width:100%;margin:0}.settings-page [hidden]{display:none!important}
@media(max-width:600px){.account-panel.settings-page,.reminders-page.settings-page,.local-calendar.settings-page,.legal-page.settings-page,.mini-settings.settings-page,.mini-schedule.settings-page{margin:12px auto;padding:0}.settings-page h1{font-size:26px}.settings-page h2{font-size:18px}.settings-page :is(.settings-card,.reminder-card,.calendar-card,.memory-item,.mini-schedule-card,.mini-reminder-picker),.settings-page>form{padding:20px 18px;border-radius:16px}.settings-card-heading{align-items:flex-start;gap:10px}.settings-page form>.button,.settings-page form>.settings-danger,.settings-page fieldset>.button{width:100%;margin-right:0}.settings-page .local-calendar-head{display:block}.settings-page .calendar-toolbar a{padding:10px 13px}.settings-page .calendar-day{padding:16px}.settings-page .mini-reminder-options{gap:6px}.settings-page .mini-reminder-options button{padding:10px 4px}}
.mini-native .settings-page h1{font-size:26px}.mini-native .settings-page button{min-height:48px}
@media(prefers-reduced-motion:reduce){.settings-page button,.settings-page a{transition:none}}

.account-panel.settings-page .button{width:auto;margin-top:8px}@media(max-width:600px){.account-panel.settings-page form>.button,.account-panel.settings-page fieldset>.button{width:100%}}

/* Match controls on account, support, help and review screens without changing their layouts. */
.ui-controls button,.ui-controls a.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;max-width:100%;padding:12px 20px;border:1px solid #cddfe8;border-radius:12px;background:white;color:#31566b;box-shadow:none;font:inherit;font-size:14px;font-weight:700;line-height:1.5;white-space:normal;text-align:center;cursor:pointer;transform:none}
.ui-controls .button,.ui-controls a.button{background:#087fa8;color:white;border-color:#087fa8}.ui-controls .button:hover,.ui-controls a.button:hover{background:#06698c;border-color:#06698c;transform:none}.ui-controls button:not(.button):hover{background:#edf6fb}
.ui-controls input:not([type=checkbox]):not([type=radio]):not([type=hidden]),.ui-controls textarea,.ui-controls select{min-height:46px;max-width:100%;padding:11px 12px;border:1px solid #bccfdc;border-radius:10px;background:white;color:#183c51;font:inherit;font-size:16px;line-height:1.5;box-sizing:border-box}
.ui-controls input[type=checkbox],.ui-controls input[type=radio]{accent-color:#087fa8}.ui-controls label{line-height:1.7}.ui-controls :is(button,a,input,select,textarea,summary):focus-visible{outline:3px solid #1197c4;outline-offset:3px}.ui-controls button:disabled{cursor:not-allowed;opacity:.5}
.ui-controls .external-provider{background:white;color:#183c51}.ui-controls .external-provider img{max-height:24px}.ui-controls .external-provider:hover{background:#edf6fb}
.native-auth-main .ui-controls button[name=switchAccount]{background:transparent;border:0;text-decoration:underline;font-weight:400}.native-auth-main .ui-controls .button{width:100%;min-height:48px}
/* Keep mail detail links consistent with the shared primary action. */
.mailbox-page a.button{background:#087fa8;border-color:#087fa8;color:white}.mailbox-page a.button:hover{background:#06698c;border-color:#06698c}
@media(prefers-reduced-motion:reduce){.ui-controls button,.ui-controls a{transition:none}}

/* The signed-in web menu remains usable with touch instead of shrinking into tiny links. */
@media(max-width:760px){body>header:has(.account-nav){height:auto;min-height:100px;display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:16px 18px 8px;max-width:100%;width:100%}body>header .account-nav{display:flex;align-items:center;flex-wrap:nowrap;gap:6px;width:100%;max-width:100%;overflow-x:auto;padding:0 0 8px;white-space:nowrap;scrollbar-width:thin}body>header .account-nav>a,body>header .account-nav button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-height:44px;padding:10px 12px;border-radius:10px;font-size:13px;line-height:1.6}body>header .account-nav>a:hover,body>header .account-nav button:hover{background:#edf6fb}body>header .account-nav form{flex-shrink:0;margin:0}.site-footer nav a{display:inline-flex;align-items:center;min-height:36px}}

.understanding-add{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.settings-page .understanding-add a.button{margin:0}.settings-page .understanding-add a.secondary{background:white;color:#31566b;border-color:#cddfe8}.understanding-progress{display:block;width:100%;height:10px;appearance:none;border:0;border-radius:10px;overflow:hidden;background:#e5eef2;accent-color:#087fa8}.understanding-progress::-webkit-progress-bar{background:#e5eef2;border-radius:10px}.understanding-progress::-webkit-progress-value{background:#087fa8;border-radius:10px}.understanding-progress::-moz-progress-bar{background:#087fa8;border-radius:10px}@media(max-width:600px){.understanding-add{flex-direction:column}.settings-page .understanding-add a.button{width:100%}}

/* Consistent action spacing, including forms nested in cards. */
.settings-page form > :is(.button,.settings-secondary,.settings-danger), .settings-page fieldset > .button { margin-top: 16px; }
.settings-page :is(.settings-card,.reminder-card,.calendar-card) { min-width: 0; }
.ui-controls :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea) { font-size: 16px; }
.ui-controls :is(button,a.button,summary) { min-height: 44px; }