/* Screen-only editor chrome: never change the A4 paper or exported content. */
@media screen {
.worksheet-shell-pending .app-container { visibility:hidden; }
.live-editor { --primary-color:#187765; background:#f1f3f0; color:#253a35; overflow:hidden; }
.live-editor [hidden] { display:none !important; }
.live-editor button,.live-editor input,.live-editor textarea { font:inherit; }
.live-editor button { cursor:pointer; }
.live-editor button:disabled { cursor:wait; }
.live-editor :is(button,input,textarea,select,summary,a):focus-visible { outline:3px solid #58a695; outline-offset:3px; }
.visually-hidden { position:absolute!important; width:1px; height:1px; clip-path:inset(50%); overflow:hidden; }
.live-editor .app-container { height:100dvh; }
.live-editor .sidebar { width:360px; min-width:360px; padding:0; gap:0; overflow:hidden; box-shadow:none; border-right:1px solid #dfe6e1; }
.live-editor .sidebar-header { padding:22px 24px 18px; gap:5px; border-bottom:1px solid #e7ece8; }
.live-editor .sidebar-logo { font-size:20px; letter-spacing:.08em; color:#187765; }
.live-editor .sidebar-header h1 { font-size:12px; font-weight:400; color:#78847e; }
.live-editor .sidebar-nav { position:absolute; top:27px; left:210px; gap:12px; font-size:12px; }
.live-editor .sidebar-nav a { color:#53675f; }
.editor-scroll { flex:1 1 auto!important; min-height:0; overflow-y:auto; padding:22px 24px; overscroll-behavior:contain; scrollbar-width:thin; }
.editor-modes { margin-bottom:24px; }
.editor-modes>label { font-size:12px; color:#718178; }
.live-editor .tab-card { padding:10px 5px; min-height:62px; gap:5px; border-radius:8px; }
.live-editor .tab-card span { font-size:13px; }
.live-editor .radio-card.active { background:#edf6f1; border-color:#187765; color:#126653; }
.editor-section { margin-bottom:24px; }
.editor-section h2 { font-size:14px; font-weight:650; margin:0; }
.section-heading { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.section-heading h2 { margin-right:auto; }
.text-action { padding:7px 0; border:0; background:transparent; color:#187765; font-size:12px!important; font-weight:600!important; }
.current-scheme { display:flex; width:100%; gap:14px; padding:14px; border:1px solid #dce7df; background:#f6f9f5; border-radius:10px; align-items:center; color:inherit; text-align:left; appearance:none; }
.current-scheme:hover { border-color:#82b09b; background:#f1f8f2; }
.current-scheme strong { font-size:14px; }
.current-scheme p { font-size:11px; line-height:1.7; color:#708176; margin-top:4px; }
.scheme-grid { display:grid; grid-template-columns:repeat(2,26px); width:52px; border-top:1px solid #dca59c; border-left:1px solid #dca59c; background:white; }
.scheme-grid span { width:26px; height:26px; display:grid; place-items:center; border-right:1px solid #dca59c; border-bottom:1px solid #dca59c; background:linear-gradient(90deg,transparent 49%,#efdcd7 50%,transparent 51%),linear-gradient(transparent 49%,#efdcd7 50%,transparent 51%); font-family:var(--device-font); font-size:20px; color:#333; }
.scheme-grid .trace-char { color:#bdbdbd; }
.live-editor textarea { height:106px; min-height:90px; resize:vertical; font-size:16px; background:#fff; border-color:#dce4de; line-height:1.7; }
#editorPractice { display:flex; flex-direction:column; gap:14px; border-top:1px solid #e7ece8; padding-top:20px; }
.live-editor .control-group { gap:10px; }
.live-editor .control-group label { font-size:12px; font-weight:500; }
.live-editor .radio-card { min-height:42px; font-size:12px; border-radius:7px; }
.live-editor .radio-group { gap:6px; }
.live-editor .radio-card span { font-size:12px; }
.editor-hint { color:#74827a; font-size:12px; line-height:1.6; }
.live-editor .accordion-group { border:0; border-bottom:1px solid #e3e9e4; border-radius:0; margin:0; }
.live-editor .accordion-group summary { padding:17px 0; background:transparent; font-size:13px; gap:8px; }
.live-editor .accordion-group summary small { margin-left:auto; font-size:11px; font-weight:400; color:#74827a; }
.live-editor .accordion-content { padding:4px 0 18px; border:0; gap:18px; }
.live-editor .size-preset-chip { font-size:11px; padding:8px 5px; }
.editor-footer { display:flex; justify-content:flex-end; padding-top:8px; }
.editor-footer #resetBtn { min-height:36px; color:#78847e!important; border:0!important; background:transparent!important; }
.live-editor .actions { position:relative; bottom:auto; margin:0; padding:16px 24px; border-top:1px solid #e1e7e2; background:#fff; box-shadow:0 -8px 24px #263b3105; }
.live-editor .output-button-primary { background:#187765; border-color:#187765; }
.live-editor .output-button-primary:hover { background:#126653; }
.live-editor .preview-area { background:#edf0ec; position:relative; padding:76px 32px 54px; overflow:auto; }
.workspace-title { position:absolute; top:25px; left:32px; display:flex; flex-direction:column; gap:3px; }
.workspace-eyebrow { font-size:14px; font-weight:600; }
.live-editor .preview-toolbar { top:25px!important; right:28px!important; gap:5px!important; }
.live-editor .preview-toolbar button,.live-editor #zoomLevel { border-color:#dce4de!important; box-shadow:none!important; border-radius:6px!important; color:#576b60; }
.fit-page { font-size:12px!important; padding:0 10px; height:32px; }
.live-editor #paper { box-shadow:0 4px 8px #253a3510,0 20px 55px #253a3512; }
.preview-summary { display:none; position:fixed; bottom:23px; left:calc(360px + (100vw - 360px)/2); transform:translateX(-50%); color:#708176; font-size:12px; white-space:nowrap; pointer-events:none; }
.live-editor .info-trigger-btn { bottom:20px; }
.mobile-editor-tools { display:none; }
.editor-dialog { color:#253a35; border:1px solid #dde6df; border-radius:18px; padding:0; width:min(720px,calc(100vw - 40px)); max-width:none; max-height:85dvh; margin:auto; box-shadow:0 28px 100px #17382b30; background:#fff; }
.editor-dialog[open] { display:flex; flex-direction:column; }
.editor-dialog::backdrop { background:#1b30284d; backdrop-filter:blur(3px); }
.editor-dialog-heading { flex:none; display:flex; align-items:center; gap:16px; justify-content:space-between; padding:22px 24px; border-bottom:1px solid #e5eae6; }
.editor-dialog-heading h2 { font-size:19px; font-weight:650; }
.editor-dialog-heading .editor-hint { margin-top:6px; }
.dialog-done { color:#187765; border:1px solid #d4e4d9; background:#f3f8f4; border-radius:8px; padding:0 18px; min-height:44px; flex-shrink:0; }
.editor-dialog-body { padding:24px; overflow-y:auto; min-height:0; overscroll-behavior:contain; }
.scheme-catalog { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.scheme-card { background:white; border:1px solid #dfe6df; border-radius:10px; padding:10px; display:flex; flex-direction:column; align-items:stretch; text-align:left; gap:9px; min-width:0; transition:border-color .15s,background .15s; }
.scheme-card:hover { border-color:#82b09b; }
.scheme-card[aria-pressed=true] { background:#f1f8f2; border:2px solid #187765; padding:9px; }
.scheme-card strong { font-size:14px; }
.scheme-check { font-size:11px; color:#187765; margin-top:auto; }
.scheme-visual { height:170px; overflow:hidden; background:#edf0ec; border-radius:6px; display:flex; justify-content:center; position:relative; pointer-events:none; }
.scheme-miniature.a4-paper { position:absolute; top:6px; width:210mm; height:297mm; transform:scale(.14); transform-origin:top center; flex-shrink:0; box-shadow:none; }
.material-search { width:100%; padding:12px 14px; border:1px solid #dce4de; border-radius:8px; font-size:16px!important; margin-bottom:20px; }
#materialDialog #resetBtn,#materialDialog #saveTemplateBtn { display:none; }
#materialDialog .template-list { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
#materialDialog .template-chip { text-align:left; white-space:normal; padding:14px; font-size:14px; border:1px solid #dfe6df; border-radius:8px; background:#fff; line-height:1.5; color:#253a35; min-width:0; }
#materialDialog .template-chip:hover,#materialDialog .template-chip.active { border-color:#187765; background:#f1f8f2; }
.material-excerpt { display:block; font-size:12px; color:#75837b; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:6px; pointer-events:none; }
.editor-dialog .editor-section { margin-bottom:0; }
#editorPanel .editor-dialog-body>.editor-section>h2,#editorPanel .section-heading h2 { display:none; }
}
@media screen and (max-width:768px), screen and (max-width:1024px) and (pointer:coarse) {
.live-editor .sidebar { position:static; width:0; min-width:0; height:0; border:0; overflow:visible; padding:0; }
.live-editor .sidebar-header { position:fixed; top:0; left:0; height:66px; width:100%; padding:16px 18px; background:#fff; border-bottom:1px solid #e1e7e2; z-index:20; }
.live-editor .sidebar-header h1,.live-editor .sidebar-nav { display:none; }
.live-editor .sidebar-logo { font-size:18px; width:max-content; }
.live-editor .editor-scroll { display:none; }
.live-editor .actions { position:fixed; z-index:25; top:9px; right:12px; bottom:auto; width:148px; padding:0; border:0; box-shadow:none; border-radius:12px; }
.live-editor .actions .output-generate { min-height:46px; font-size:13px; }
.live-editor .actions>.export-status { display:none; }
.live-editor .actions:has(.export-status[role=alert])>.export-status { display:block; padding:8px; background:#fff4f0; border-radius:8px; }
.live-editor .actions[data-output-state=ready] { top:72px; left:12px; right:12px; width:auto; padding:16px; box-shadow:0 12px 40px #193a2926; border:1px solid #dce4de; }
.live-editor .preview-area { width:100%; height:calc(100dvh - 66px - 74px - env(safe-area-inset-bottom)); flex:0 0 auto; margin-top:66px; padding:70px 16px 40px; }
.workspace-title { top:16px; left:18px; }
.workspace-title .editor-hint { display:none; }
.live-editor .preview-toolbar { top:10px!important; right:12px!important; gap:2px!important; }
.live-editor .preview-toolbar button { min-width:38px; min-height:44px; }
.live-editor #zoomInBtn,.live-editor #zoomOutBtn,.live-editor #zoomLevel { display:none!important; }
.live-editor .preview-toolbar { max-width:calc(100% - 24px); flex-wrap:nowrap; z-index:12!important; }
.live-editor .fit-page { min-width:74px; }
.preview-summary { display:block; position:fixed; left:50%; bottom:calc(92px + env(safe-area-inset-bottom)); font-size:11px; }
.mobile-editor-tools { display:grid; grid-template-columns:repeat(4,1fr); position:fixed; bottom:0; left:0; right:0; height:calc(74px + env(safe-area-inset-bottom)); padding:6px 12px calc(6px + env(safe-area-inset-bottom)); background:#fff; border-top:1px solid #dfe6e1; z-index:30; }
.mobile-editor-tools button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; border:0; border-radius:8px; background:transparent; color:#53675f; font-size:11px; min-height:44px; }
.mobile-editor-tools button:active { background:#edf6f1; color:#187765; }
.tool-symbol { font-family:var(--device-font); font-size:20px; line-height:25px; }
.live-editor .info-trigger-btn { bottom:calc(88px + env(safe-area-inset-bottom)); right:12px; min-height:36px; font-size:11px; }
.editor-dialog { width:100%; max-height:var(--editor-viewport-height,100dvh); border:0; border-radius:18px 18px 0 0; position:fixed; inset:auto 0 0; margin:0; }
#editorPanel { height:min(66dvh,var(--editor-viewport-height,100dvh)); }
#editorPanel[data-panel=内容],#schemeDialog,#materialDialog { height:var(--editor-viewport-height,100dvh); border-radius:0; }
.editor-dialog-heading { padding:16px 18px; }
.editor-dialog-heading h2 { font-size:18px; }
.editor-dialog-heading .editor-hint { font-size:11px; }
.editor-dialog-body { padding:20px 18px max(24px,env(safe-area-inset-bottom)); }
.scheme-catalog { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
#materialDialog .template-list { grid-template-columns:1fr; }
#editorPanel textarea { min-height:180px; font-size:16px; }
.editor-dialog input[type=text] { font-size:16px!important; }
.editor-dialog .radio-card,.editor-dialog .size-preset-chip,.editor-dialog .color-btn { min-height:44px; }
.editor-dialog .text-action { min-height:44px; font-size:13px!important; }
.editor-dialog .control-group label { font-size:14px; }
.editor-dialog .editor-modes { margin-bottom:20px; }
}
@media screen and (max-height:500px) and (max-width:1024px) {
#editorPanel { height:var(--editor-viewport-height,100dvh); border-radius:0; }
.editor-dialog-heading .editor-hint { display:none; }
}
@media (prefers-reduced-motion:reduce) {
.live-editor *, .live-editor *::before,.live-editor *::after { transition:none!important; animation:none!important; }
}
@media print {
.editor-dialog,.mobile-editor-tools,.workspace-title,.preview-summary { display:none!important; }
}
@media screen {
.live-editor .tab-card.active svg { color:#187765; }
.live-editor .fit-page { border:1px solid #dce4de; background:#fff; }
}
@media screen and (max-width:768px), screen and (max-width:1024px) and (pointer:coarse) {
.editor-dialog { bottom:var(--editor-viewport-bottom,0px); }
.live-editor .info-trigger-btn { font-size:0; padding:8px; width:36px; height:36px; }
.live-editor .info-trigger-btn svg { width:18px; height:18px; }
}
@media screen {
#editorPanel::backdrop { background:rgba(27,48,40,.08); backdrop-filter:none; }
}

/* Color choices share one compact, labelled treatment across mouse and touch. */
@media screen {
.live-editor .tab-card.active svg { stroke:currentColor; }
.live-editor .radio-card { position:relative; box-shadow:none; }
.live-editor .radio-card.active { background:#f0f6f3; border-color:#187765; box-shadow:inset 0 0 0 1px #187765; }
.live-editor .color-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:stretch; gap:8px; }
.live-editor :is(.color-btn,.custom-color-wrapper) {
    position:relative; display:flex; align-items:center; gap:9px; min-width:0;
    height:44px; min-height:44px; padding:0 28px 0 12px; margin:0;
    border:1px solid #d9e3dc; border-radius:8px; background:#fff;
    color:#40574c; font-size:12px; font-weight:500; line-height:1.3;
    text-indent:0; text-align:left; overflow:hidden;
    box-shadow:none; transform:none; transition:background .15s,border-color .15s;
}
.live-editor :is(.color-btn,.custom-color-wrapper)::before {
    content:''; width:18px; height:18px; flex:0 0 18px; border-radius:50%;
    background:var(--swatch); border:1px solid #0002; pointer-events:none;
}
.live-editor :is(.color-btn,.custom-color-wrapper):hover { background:#f6f9f7; border-color:#9fb5a8; box-shadow:none; transform:none; }
.live-editor :is(.color-btn,.custom-color-wrapper).active { background:#edf5f0; border-color:#187765; box-shadow:none; transform:none; }
.live-editor :is(.color-btn,.custom-color-wrapper).active::after {
    content:'✓'; position:absolute; right:10px; top:50%; transform:translateY(-50%);
    font-size:14px; font-weight:700; color:#187765; pointer-events:none;
}
.live-editor .custom-color-wrapper:last-child:nth-child(odd) { grid-column:1/-1; }
.live-editor .custom-color-hint { position:static; display:block; color:inherit; font:inherit; text-shadow:none; pointer-events:none; }
.live-editor .custom-color-picker {
    position:absolute; inset:0; z-index:1; display:block;
    width:100%; height:100%; min-width:0; padding:0; margin:0; border:0;
    opacity:0; cursor:pointer;
}
.live-editor .custom-color-wrapper:focus-within,.live-editor .color-btn:focus-visible {
    outline:2px solid #187765; outline-offset:-3px;
}
}

/* Keep mode switching visible even when all mobile editing panels are closed. */
@media screen and (max-width:768px), screen and (max-width:1024px) and (pointer:coarse) {
.live-editor .sidebar>.editor-modes { position:fixed; top:66px; left:0; right:0; z-index:20; margin:0; padding:6px 12px; height:56px; background:#fff; border-bottom:1px solid #dfe6e1; }
.live-editor .sidebar>.editor-modes>label,.live-editor .sidebar>.editor-modes svg { display:none; }
.live-editor .sidebar>.editor-modes .tab-card { min-height:44px; height:44px; padding:0 3px; justify-content:center; }
.live-editor .sidebar>.editor-modes .tab-card span { font-size:12px; white-space:nowrap; }
.live-editor .preview-area { margin-top:122px; height:calc(100dvh - 122px - 74px - env(safe-area-inset-bottom)); }
.live-editor .actions[data-output-state=ready] { top:128px; }
.mobile-editor-tools { gap:8px; }
.mobile-editor-tools button { background:#f2f7f4; border:1px solid #d7e5dc; color:#275f4b; font-size:12px; font-weight:600; gap:3px; }
.mobile-editor-tools button:active { background:#dcefe3; border-color:#187765; }
.mobile-editor-tools .tool-symbol { display:flex; align-items:center; justify-content:center; height:23px; }
}
@media screen {
.quick-materials { margin-top:16px; }
.quick-material-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:10px; }
.quick-material { min-height:40px; padding:8px 5px; border:1px solid #dce6df; border-radius:7px; background:#f6f9f7; color:#365e4b; font-size:12px!important; line-height:1.4; }
.quick-material:hover,.quick-material[aria-pressed=true] { border-color:#187765; background:#eaf4ee; }
.material-applied { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:12px; color:#187765; margin-top:8px; }
.ai-practice-guide { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:42px; margin-top:10px; padding:10px 12px; border:1px solid #d5e5dc; border-radius:8px; background:#eef6f1; color:#176b56; font-size:12px; font-weight:600; line-height:1.5; text-decoration:none; }
.ai-practice-guide:hover { border-color:#82b09b; background:#e4f1e9; }
.scheme-current-summary { margin:20px 0 14px; font-size:13px; line-height:1.7; color:#496453; }
.scheme-fine-tune { border-top:1px solid #dce6df; }
.scheme-fine-tune>summary { padding:18px 0; cursor:pointer; font-size:14px; font-weight:600; color:#275f4b; }
.scheme-fine-tune #editorPractice { border-top:0; padding-top:0; }

}
@media screen and (max-width:768px), screen and (max-width:1024px) and (pointer:coarse) {
.mobile-editor-tools { grid-template-columns:repeat(3,minmax(0,1fr)); }
#editorPanel[data-panel=内容] { height:var(--editor-viewport-height,100dvh); border-radius:0; }
#editorPanel[data-panel=内容]:has(textarea:focus,input:focus) { height:var(--editor-viewport-height,100dvh); border-radius:0; }
#editorPanel textarea { min-height:90px; height:100px; }
.quick-material { min-height:44px; }
}

/* Separate choosing a layout from fine adjustment of the live page. */
@media screen {
.live-editor button { -webkit-appearance:none; }
.scheme-card { color:#253a35; gap:10px; padding:12px; border-radius:12px; }
.scheme-card[aria-pressed=true] { padding:11px; }
.scheme-card strong { color:#253a35; font-size:15px; }
.scheme-card .editor-hint { font-size:12px; }
.scheme-visual { height:190px; background:#edf1ee; }
.scheme-miniature.a4-paper { top:8px; transform-origin:top left; border-radius:0; }
.scheme-miniature .worksheet-document,.scheme-miniature .worksheet-page { height:100%; }
.scheme-miniature .worksheet-page { min-height:0; }
.scheme-miniature .worksheet-character { font-size:44px; }
.scheme-miniature .worksheet-poetry { height:auto; grid-template-rows:auto; }
.scheme-miniature .worksheet-poetry.poetry-split2 { grid-template-rows:repeat(2,auto); }
.scheme-miniature .worksheet-poetry.poetry-split2 .worksheet-block { width:72%; }
.scheme-miniature .worksheet-poetry.poetry-quadrant { grid-template-rows:repeat(2,auto); }
.scheme-footer { display:flex; align-items:center; gap:16px; justify-content:space-between; padding:18px 24px; border-top:1px solid #e1e8e3; background:#f7faf8; flex-shrink:0; }
#schemeDialog .editor-dialog-body { flex:1 1 auto; }
.scheme-footer .scheme-current-summary { margin:0; font-size:12px; }
.tune-action { min-height:44px; white-space:nowrap; padding:0 18px; border:1px solid #187765; border-radius:8px; background:#187765; color:#fff; font-size:13px; font-weight:650; }
.tune-action:hover { background:#126653; border-color:#126653; }
#fineTuneDialog { width:min(460px,calc(100vw - 32px)); }
#fineTuneDialog::backdrop { background:#1b302808; backdrop-filter:none; }
#fineTuneDialog #editorPractice { padding:0; margin:0; border:0; }
.preview-summary { border:1px solid #d6e3da; border-radius:20px; padding:7px 12px; background:#f7faf8; pointer-events:auto; color:#436b56; }
.editor-dialog-heading h2:focus { outline:none; }
}
@media screen and (max-width:768px), screen and (max-width:1024px) and (pointer:coarse) {
.live-editor .sidebar-header { border-bottom:0; }
#editorPanel[data-panel=内容] { height:var(--editor-viewport-height,100dvh); border-radius:0; }
#editorPanel[data-panel=内容] textarea { height:148px; }
.scheme-footer { padding:14px 18px max(14px,env(safe-area-inset-bottom)); gap:12px; }
.scheme-footer .scheme-current-summary { max-width:210px; line-height:1.6; }
#schemeDialog .editor-dialog-body { padding:14px; }
.scheme-catalog { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.scheme-card { padding:9px; gap:8px; }
.scheme-card[aria-pressed=true] { padding:8px; }
.scheme-card strong { font-size:14px; }
.scheme-card .editor-hint { font-size:11px; line-height:1.45; }
.scheme-visual { height:150px; }
.tune-action { min-width:132px; }
#fineTuneDialog { width:100%; height:min(320px,42dvh); max-height:var(--editor-viewport-height,100dvh); border-radius:18px 18px 0 0; }
#fineTuneDialog .editor-dialog-heading { padding:12px 18px; }
#fineTuneDialog .editor-dialog-heading .editor-hint { display:none; }
#fineTuneDialog .editor-dialog-body { padding:16px 18px max(20px,env(safe-area-inset-bottom)); }
.live-editor.fine-tuning .preview-area { height:calc(100dvh - 122px - min(320px,42dvh)); padding-top:56px; padding-bottom:12px; }
.live-editor.fine-tuning .preview-summary,.live-editor.fine-tuning .info-trigger-btn { visibility:hidden; }
}

/* Optional printed footer, alongside other page appearance settings. */
.reprint-setting { display: flex; align-items: flex-start; gap: 10px; padding: 12px 0 4px; cursor: pointer; }
.reprint-setting input { flex: none; width: 16px; height: 16px; margin: 3px 0 0; accent-color: #476556; }
.reprint-setting strong { display: block; font-size: 13px; font-weight: 500; color: #39473f; }
.reprint-setting small { display: block; margin-top: 4px; font-size: 12px; font-weight: 400; line-height: 1.6; color: #7c837e; }

.reprint-tip-editor label { display: block; font-size: 12px; color: #59665e; margin-bottom: 8px; }
.reprint-tip-editor textarea { width: 100%; box-sizing: border-box; min-height: 76px; resize: vertical; padding: 10px 12px; border: 1px solid #dce4de; border-radius: 8px; font: inherit; font-size: 13px; line-height: 1.6; background: #fff; }
.reprint-tip-editor small { display: block; margin-top: 6px; color: #7c837e; font-size: 11px; line-height: 1.6; }

.editor-modes .radio-group{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}

.semantic-tune{display:grid;gap:10px;margin:12px 0}.semantic-tune-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,1.2fr);align-items:center;gap:12px;min-height:44px;color:#39473f;font-size:13px}.semantic-tune-row select{width:100%;min-height:44px;padding:8px 34px 8px 10px;border:1px solid #d4dfd8;border-radius:8px;background:#fff;color:#243a31;font:inherit}.semantic-tune-row select:focus-visible{outline:3px solid #b9ddcb;outline-offset:2px}
@media screen and (max-width:768px), screen and (max-width:1024px) and (pointer:coarse){
.editor-modes .radio-group{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:4px!important;overflow:visible}
.semantic-tune-row{grid-template-columns:1fr;gap:5px}.semantic-tune-row select{min-height:44px}
}

.practice-settings #editorPractice{border-top:0;padding-top:4px;margin:0;padding-bottom:18px}
@media(max-width:768px),(max-width:1024px) and (pointer:coarse){.practice-settings{display:none}}

/* Extra practice types live in a compact mobile sheet. */
@media screen {
.live-editor .more-mode-button{display:none;appearance:none;-webkit-appearance:none;background:transparent;color:#334155;-webkit-text-fill-color:currentColor;-webkit-tap-highlight-color:transparent}
.live-editor .more-mode-button:active{background:#edf6f1}
.mode-catalog{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mode-choice{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0;min-height:154px;padding:18px;border:1px solid #dbe6df;border-radius:12px;background:#fff;color:#253a35;text-align:left}
.mode-choice svg{width:24px;height:24px;color:#187765}
.mode-choice strong{font-size:15px;font-weight:600}
.mode-choice-description{font-size:12px;line-height:1.7;color:#718178}
.mode-choice-status{font-size:11px;color:#187765;margin-top:auto}
.mode-choice[aria-pressed=true]{border-color:#187765;background:#f0f7f2;box-shadow:inset 0 0 0 1px #187765}
#modeDialog .editor-dialog-body{padding-top:6px}
}
@media screen and (max-width:768px), screen and (max-width:1024px) and (pointer:coarse){
.live-editor .sidebar>.editor-modes .tab-card[data-mobile-secondary]{display:none}
.live-editor .sidebar>.editor-modes .more-mode-button{display:flex;flex-direction:row;gap:2px;padding:0;min-width:0;font-weight:500}
.more-mode-arrow{font-size:10px!important;color:inherit;opacity:.75}
#modeDialog{max-height:min(70dvh,var(--editor-viewport-height,100dvh));padding-bottom:env(safe-area-inset-bottom)}
}
@media screen and (max-width:768px), screen and (max-width:1024px) and (pointer:coarse){.live-editor .sidebar>.editor-modes .more-mode-arrow svg{display:block;width:10px;height:10px}.more-mode-arrow{display:flex;align-items:center}}
@media screen and (max-width:360px){
.live-editor .sidebar>.editor-modes .tab-card .more-mode-label{font-size:11px}
.live-editor .sidebar>.editor-modes .more-mode-button{gap:1px}
.live-editor .sidebar>.editor-modes .more-mode-arrow svg{width:8px;height:8px}
}
