/* Settings are quiet utility surfaces: preferences first, saves second. */
.settings-modal{width:min(510px,calc(100% - 28px));background:linear-gradient(145deg,#fcf9f2f7,#f4eff5f7);box-shadow:inset 0 1px 0 #fff,0 24px 80px #534a642b}
.settings-modal .modal-inner,.save-tutorial-modal .modal-inner{padding:28px 30px 16px}
.settings-modal .modal-header,.save-tutorial-modal .modal-header{align-items:center;margin-bottom:0}
.settings-modal .modal-header h2,.save-tutorial-modal .modal-header h2{font-size:25px;letter-spacing:.06em}
.settings-intro{font-size:12px;color:var(--muted);margin:1px 0 25px;line-height:1.7}
.settings-section{margin:0;padding:0 0 20px}
.settings-label{display:flex;align-items:center;gap:10px;font:12px/1.6 var(--sans);letter-spacing:.1em;margin:0 0 16px;color:#655c6d}
.settings-label>span{font:10px var(--serif);letter-spacing:.04em;color:#8b7e91}
.settings-name{display:block;font-size:13px;line-height:1.7}
.settings-pace>.settings-name{margin-bottom:9px}
.settings-modal .mode-switch{width:100%;align-self:stretch;border-color:#fffdf8;background:#e5dfeb42;box-shadow:inset 0 1px 3px #7d6d8910;padding:4px}
.settings-modal .mode-switch button{flex:1;min-height:44px;font-size:12px;padding:7px 10px}
.settings-modal .mode-switch button[aria-pressed=true]{background:linear-gradient(140deg,#fffefaf2,#f5f0f8df);box-shadow:inset 0 1px 0 #fff,0 2px 7px #65577713;color:#685772}
.settings-caption{font:11px/1.8 var(--sans);color:var(--muted);margin:9px 0 0;letter-spacing:0}
.settings-motion{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:17px;padding-top:16px;border-top:1px solid #b3a6ba25}
.settings-motion .settings-caption{margin:3px 0 0}
.settings-toggle{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-height:44px;padding:3px 0 3px 8px;border:0;border-radius:12px;background:none;box-shadow:none;color:#796b81}
.settings-toggle:hover{background:none;box-shadow:none}
.settings-toggle-track{position:relative;display:block;flex:none;width:36px;height:22px;border:1px solid #d2c9d6;border-radius:999px;background:#e6e0e9;box-shadow:inset 0 1px 2px #65577712}
.settings-toggle-track:after{content:'';position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#fffdf8;box-shadow:0 1px 3px #6e5f7b25;transition:transform .2s ease}
.settings-toggle[aria-checked=true] .settings-toggle-track{background:#c5b6d1;border-color:#c5b6d1}
.settings-toggle[aria-checked=true] .settings-toggle-track:after{transform:translateX(14px)}
.settings-toggle-word{font-size:10px}
.settings-saves{padding-top:17px;border-top:1px solid #b3a6ba35}
.settings-section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px}
.settings-section-heading .settings-label{margin:0}
.settings-icon{width:19px;height:19px;flex:none}
.settings-help{display:flex;align-items:center;gap:6px;min-height:44px;padding:4px 0 4px 8px;border:0;background:none;box-shadow:none;color:#7c6989;font-size:11px;white-space:nowrap}
.settings-help .settings-icon{width:15px;height:15px}
.settings-help:hover{box-shadow:none;background:none;text-decoration:underline;text-underline-offset:5px}
.settings-save-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.settings-action{display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px;border-radius:16px;border:1px solid #fffdf8ed;background:linear-gradient(145deg,#fffdf8e6,#eee7f07d);box-shadow:inset 0 1px 0 #fff,0 0 0 1px #b5a5bf32,0 4px 13px #74627e09;font-size:12px;color:#62576c}
.settings-action .settings-icon{color:#91809d}
.settings-action:hover{background:linear-gradient(145deg,#fffefcf5,#eee5f2bd);box-shadow:inset 0 1px 0 #fff,0 0 0 1px #b5a5bf5c,0 4px 15px #74627e10}
.settings-saves .backup-status{font-size:11px;line-height:1.8;margin:12px 0 0;color:#716379;overflow-wrap:anywhere}
.settings-saves .backup-status:empty{display:none}
.settings-more{border-top:1px solid #b3a6ba35}
.settings-more summary{min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;font-size:11px;color:#7b727c;list-style:none}
.settings-more summary::-webkit-details-marker{display:none}
.settings-more summary .settings-icon{width:15px;height:15px;transform:rotate(90deg);transition:transform .2s}
.settings-more[open] summary .settings-icon{transform:rotate(-90deg)}
.settings-more-links{display:grid;padding-bottom:8px}
.settings-more-links button{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:44px;border:0;border-radius:10px;background:none;box-shadow:none;padding:8px 0;font-size:12px;text-align:left;color:#625d63}
.settings-more-links button span{font-size:12px;color:#9b8ba6}
.settings-more-links button:hover{color:#776085;background:#eee7f040}
.save-tutorial-modal{width:min(550px,calc(100% - 28px));background:linear-gradient(145deg,#fcfaf3,#f3edf5)}
.settings-back{display:flex;align-items:center;gap:6px;min-height:44px;border:0;background:none;box-shadow:none;padding:4px 0;font-size:11px;color:#82718e;margin-top:5px}
.settings-back .settings-icon{width:15px;height:15px}
.settings-back:hover{box-shadow:none;background:none;color:#655070}
.save-tutorial-heading{text-align:center;padding:7px 0 22px}
.save-tutorial-mark{display:grid;place-items:center;width:44px;height:44px;margin:0 auto 13px;border-radius:16px;background:linear-gradient(145deg,#fffdf4,#eae1f0a6);border:1px solid #fffef8;box-shadow:inset 0 1px 0 #fff,0 0 0 1px #c4b5cd29;color:#9d86ac}
.save-tutorial-mark .settings-icon{width:23px;height:23px}
.save-tutorial-heading .eyebrow{font-size:8px;letter-spacing:.21em;color:#96849f;margin-bottom:10px}
.save-tutorial-heading h3{font-size:29px;line-height:1.55;letter-spacing:.05em;margin:0 0 11px}
.save-tutorial-heading>p:last-child{font-size:11px;color:var(--muted);margin:0}
.save-tutorial-steps{list-style:none;padding:0;margin:0}
.save-tutorial-steps li{position:relative;display:flex;align-items:flex-start;gap:16px;padding:0 0 22px}
.save-tutorial-steps li:not(:last-child):before{content:'';position:absolute;left:13px;top:31px;bottom:5px;width:1px;background:linear-gradient(#c8b9d257,#c8b9d219)}
.save-step-number{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;border:1px solid #c7b7d049;background:#fffcf8a3;font:10px var(--serif);color:#8f7c9d}
.save-tutorial-steps h4{font:13px/1.6 var(--sans);margin:2px 0 5px;color:#65576f}
.save-tutorial-steps p{font:12px/1.85 var(--sans);color:var(--muted);margin:0}
.save-tutorial-note{font-size:11px;line-height:1.85;color:#807184;padding:13px 15px;border:1px solid #fffef8;border-radius:13px;background:#eee5f25e;margin:0 0 20px}
.settings-tutorial-done{display:flex;align-items:center;justify-content:space-between;gap:15px;width:100%;min-height:48px;border:1px solid #fffef8;border-radius:16px;background:linear-gradient(145deg,#fffdf6,#eae1f0a1);box-shadow:0 0 0 1px #b5a5bf32,inset 0 1px 0 #fff;color:#74617f;font-size:12px;padding:12px 16px;margin-bottom:10px}
@media(max-width:540px){.settings-modal .modal-inner,.save-tutorial-modal .modal-inner{padding:20px 22px 12px}.settings-intro{margin-bottom:22px}.settings-modal .modal-header h2,.save-tutorial-modal .modal-header h2{font-size:23px}.save-tutorial-heading{padding-top:0}.save-tutorial-heading h3{font-size:27px}.save-tutorial-steps li{gap:12px;padding-bottom:20px}}
@media(prefers-reduced-motion:reduce){.settings-toggle-track:after,.settings-more summary .settings-icon{transition:none}}
body[data-magic-motion=off] .settings-toggle-track:after,body[data-magic-motion=off] .settings-more summary .settings-icon{transition:none}
@media(prefers-reduced-transparency:reduce){.settings-modal,.save-tutorial-modal{background:#f8f3ed}.settings-action,.settings-modal .mode-switch button[aria-pressed=true],.settings-tutorial-done{background:#f9f5f9}.save-tutorial-note{background:#eee7f1}}
@media(forced-colors:active){.settings-toggle-track,.settings-action,.save-tutorial-mark,.save-step-number,.save-tutorial-note,.settings-tutorial-done{background:Canvas;color:CanvasText;border:1px solid CanvasText;box-shadow:none}.settings-toggle-track:after{background:ButtonText}.settings-toggle[aria-checked=true] .settings-toggle-track{background:Highlight;border-color:Highlight}.settings-modal .mode-switch button[aria-pressed=true]{outline:1px solid Highlight}.settings-icon{color:ButtonText}}