.learning-font-entry{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:52px;padding:14px 16px;border:1px solid #acc2e2;border-radius:12px;background:#f3f7fc;color:#44577a;text-align:left;font:600 16px Raleway,sans-serif;cursor:pointer}
.learning-font-entry small{display:block;margin-top:3px;font-size:13px;font-weight:400}
.learning-font-entry:focus-visible,.learning-font-dialog button:focus-visible,.learning-font-dialog select:focus-visible,.learning-font-preview-scroll:focus-visible{outline:3px solid #44577a;outline-offset:3px}
.learning-font-scope{margin:10px 0 0;color:#526079;font-size:13px;line-height:1.5}
.learning-font-dialog{box-sizing:border-box;width:min(1040px,calc(100vw - 24px));max-height:calc(100dvh - 32px);margin:auto;padding:24px;border:1px solid #b7c9df;border-radius:22px;background:#fff;color:#25364d;font-family:Raleway,sans-serif;overflow:auto;box-shadow:0 20px 80px #263b5940}
.learning-font-dialog::backdrop{background:#263b5970;backdrop-filter:blur(3px)}
.learning-font-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.learning-font-eyebrow{margin:0 0 6px;color:#526079;font-size:12px;font-weight:600;letter-spacing:.04em}
.learning-font-dialog h2{margin:0;font:400 28px NauryzRedKeds,Raleway,sans-serif;line-height:1.25}
.learning-font-help{max-width:780px;margin:16px 0 20px;font-size:14px;line-height:1.5}
.learning-font-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px}
.learning-font-controls label{display:block;margin-bottom:8px;font-size:14px;font-weight:700}
.learning-font-controls select{width:100%;min-height:48px;border:1px solid #97aecb;border-radius:10px;background:#fff;padding:10px;color:#25364d;font:500 16px Raleway,sans-serif}
.learning-font-controls #learningFontSampleSelect{border-radius:12px;padding:10px 12px;font:500 14px/1.5 Raleway,sans-serif}
.learning-font-picker{position:relative;min-width:0}
.learning-font-picker select[hidden],.learning-font-picker-menu[hidden]{display:none}
.learning-font-picker-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px;padding:10px 12px;border:1px solid #97aecb;border-radius:12px;background:#fff;color:#25364d;text-align:left;font:500 14px/1.5 Raleway,sans-serif;cursor:pointer}
.learning-font-picker-trigger span:first-child{min-width:0;overflow-wrap:anywhere}
.learning-font-picker-chevron{flex:none;width:8px;height:8px;margin-right:3px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg)}
.learning-font-picker-trigger:hover,.learning-font-picker-trigger[aria-expanded=true]{background:#eff5ff;border-color:#718eaf}
.learning-font-picker-menu{position:absolute;z-index:40;top:calc(100% + 6px);left:0;right:0;max-height:240px;overflow:auto;overscroll-behavior:contain;padding:6px;border:1px solid #b7c9df;border-radius:14px;background:#fff;box-shadow:0 8px 28px #263b5924;scroll-padding:4px}
.learning-font-picker-option{position:relative;display:block;width:100%;min-height:44px;padding:10px 30px 10px 10px;border:0;border-radius:9px;background:#fff;color:#25364d;text-align:left;font:500 14px/1.5 Raleway,sans-serif;overflow-wrap:anywhere;cursor:pointer}
.learning-font-picker-option:hover,.learning-font-picker-option:focus{background:#eff5ff}
.learning-font-picker-option[aria-selected=true]{background:#e4efff;font-weight:700}
.learning-font-picker-option[aria-selected=true]::after{content:'✓';position:absolute;right:10px;top:11px}
.learning-font-dialog .learning-font-picker-option:focus-visible{outline:2px solid #44577a;outline-offset:-2px}
.learning-font-controls p{margin:14px 0 0;font-size:13px;line-height:1.55;color:#526079}
.learning-font-example{min-width:0}
.learning-font-sample-name{margin:0 0 10px;font:600 13px Raleway,sans-serif;color:#526079}
.learning-font-preview-scroll{max-height:min(58dvh,560px);overflow:auto;overscroll-behavior:contain;border-radius:24px;padding:16px;background:#D2E4FF}
.learning-font-preview-type{font-family:NauryzRedKeds,Raleway,sans-serif;letter-spacing:.02em}
.learning-font-dialog [data-font-advice]:not(.tab-panel){padding-top:1em}
.learning-font-footer{margin-top:20px;padding-top:16px;border-top:1px solid #e0e7f0;display:flex;align-items:center;justify-content:space-between;gap:20px}
.learning-font-footer p{max-width:420px;margin:0;font-size:13px;line-height:1.5;color:#526079}
.learning-font-footer>div{display:flex;gap:10px;flex:none}
.learning-font-header button,.learning-font-footer button{min-height:44px;border:1px solid #bac9dd;border-radius:10px;padding:10px 16px;background:#fff;color:#25364d;font:600 14px Raleway,sans-serif;cursor:pointer}
.learning-font-footer [data-font-choose]{background:#44577a;color:#fff;border-color:#44577a}
.learning-font-footer button:disabled{opacity:.5;cursor:default}
.sound-choice{display:flex;align-items:center;gap:8px}
.sound-settings-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.sound-choice select{flex:1;min-width:0;min-height:44px}
.sound-picker{position:relative;flex:1;min-width:0}
.sound-picker select[hidden],.sound-picker-menu[hidden]{display:none}
.sound-picker-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:48px;padding:12px 16px;border:1px solid transparent;border-radius:16px;background:#eff5ff;color:#44577a;font:500 14px/1.5 Raleway,sans-serif;text-align:left;cursor:pointer}
.sound-picker-trigger span:first-child{min-width:0;overflow-wrap:anywhere}
.sound-picker-trigger:hover{border-color:#c4d5ed;background:#e8f1ff}
.sound-picker-chevron{width:8px;height:8px;margin-right:3px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);flex:none}
.sound-picker-trigger[aria-expanded=true]{border-color:#98b0d0;background:#e8f1ff}
.sound-picker-menu{position:absolute;z-index:40;top:calc(100% + 6px);left:0;right:0;max-height:250px;overflow:auto;overscroll-behavior:contain;padding:6px;border:1px solid #c4d5ed;border-radius:16px;background:#fff;box-shadow:0 8px 28px #263b5924}
.sound-picker-option{position:relative;display:block;width:100%;min-height:44px;padding:10px 30px 10px 12px;border:0;border-radius:10px;background:#fff;color:#44577a;text-align:left;font:500 14px/1.5 Raleway,sans-serif;overflow-wrap:anywhere;cursor:pointer}
.sound-picker-option:hover,.sound-picker-option:focus{background:#eff5ff}
.sound-picker-option[aria-selected=true]{background:#e4efff;font-weight:700}
.sound-picker-option[aria-selected=true]::after{content:'✓';position:absolute;right:12px;top:11px}
.sound-picker-trigger:focus-visible,.sound-picker-option:focus-visible{outline:2px solid #44577a;outline-offset:2px}
.sound-picker-trigger:disabled{opacity:.5;cursor:default}
.sound-preview-button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;padding:0;border:1px solid #d2e0f2;border-radius:50%;background:#f3f7fc;color:#44577a;cursor:pointer;transition:background-color .15s}
.sound-preview-button svg{width:20px;height:20px}
.sound-preview-button:hover{background:#edf2f9}
.sound-preview-button:focus-visible{outline:3px solid #44577a;outline-offset:2px}
.sound-preview-button:active{background:#dfe9f5}
.new-work-timer{margin-top:16px}
.new-work-timer-heading{position:relative;display:flex;align-items:center;gap:4px}
.new-work-timer-heading>label{display:flex;align-items:center;gap:10px;min-height:44px;padding-left:8px;color:#526079;font:500 14px/1.5 Raleway,sans-serif;cursor:pointer}
.new-work-timer-heading input{width:16px;height:16px;flex:none;margin:0;accent-color:#44577a}
.new-work-timer-help{color:#526079}
.new-work-timer-help summary{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;cursor:pointer;list-style:none}
.new-work-timer-help summary::-webkit-details-marker{display:none}
.new-work-timer-help summary svg{width:18px;height:18px}
.new-work-timer-help summary:focus-visible{outline:3px solid #44577a;outline-offset:2px}
.new-work-timer-help p{display:none;position:absolute;left:8px;top:44px;z-index:20;box-sizing:border-box;width:min(300px,calc(100vw - 100px));margin:0;padding:12px 14px;border:1px solid #b7c9df;border-radius:12px;background:#fff;color:#25364d;font:400 13px/1.5 Raleway,sans-serif;box-shadow:0 6px 24px #263b5920}
.new-work-timer-help[open] p{display:block}
.new-work-timer-fields{margin-top:8px}
.new-work-timer-fields:not(.hidden){display:flex;flex-wrap:wrap;align-items:flex-start;gap:16px}
.new-work-timer-fields>label{flex:1 1 200px;color:#526079;font:500 14px/1.5 Raleway,sans-serif;padding-left:8px}
.new-work-timer-fields>label:not(.hidden){display:block}
#newWorkTimerDuration{flex:0 1 120px}
.new-work-timer-fields select,.new-work-timer-fields input[type="number"]{display:block;box-sizing:border-box;width:100%;min-height:44px;margin-top:8px;padding:10px 12px;border:1px solid #cfdae7;border-radius:12px;background:#fff;color:#44577a;font:500 14px/1.5 Raleway,sans-serif}
.new-work-timer-fields>.new-work-smart-toggle:not(.hidden){display:flex;flex:0 1 160px;align-self:flex-end;align-items:center;gap:10px;min-height:44px;padding:0 8px}
.new-work-smart-toggle input[type="checkbox"]{display:block;flex:none;width:16px;height:16px;min-height:0;margin:0;padding:0;accent-color:#44577a}
@media(max-width:639px){.new-work-timer-fields>.new-work-smart-toggle:not(.hidden){flex-basis:100%}}
.new-work-timer-fields select:focus-visible,.new-work-timer-fields input:focus-visible{outline:3px solid #44577a;outline-offset:2px}
@media(hover:hover){.new-work-timer-help:hover p{display:block}}
@media(max-width:650px){.learning-font-dialog{padding:20px}.learning-font-dialog h2{font-size:24px}.learning-font-layout{grid-template-columns:1fr;gap:18px}.learning-font-footer{align-items:stretch;flex-direction:column;gap:14px}.learning-font-footer>div{flex-wrap:wrap}.learning-font-footer>div button{flex:1;min-width:120px}.learning-font-preview-scroll{padding:12px;max-height:48dvh}}
@media(prefers-reduced-motion:reduce){.sound-preview-button{transition:none}}