/* Flashcard studio: writing, selecting and previewing stay in one workspace. */
.modal.editor-modal{max-width:1070px;border-radius:21px}
.editor-modal{--studio-panel:#f8fafb;--studio-border:#e1e7eb;--studio-text:#283849;--studio-muted:#697986;--studio-green:#3e662f;--studio-selection:#d8edbd;--studio-preview:#f1f5ec;--studio-preview-card:#fff;--studio-input:#fff}
.editor-modal [hidden]{display:none!important}
.editor-modal .studio-header{padding:24px 28px;align-items:center;background:linear-gradient(115deg,#f8fbf4,#fff 65%)}
.studio-identity{display:flex;align-items:center;gap:15px}
.studio-mark{height:46px;width:46px;border-radius:14px;background:#e7f1da;color:#789a53;display:grid;place-items:center;flex-shrink:0}
.studio-mark .icon{width:25px;height:25px}
.studio-eyebrow{display:block;font-size:9px;font-weight:750;letter-spacing:1.8px;color:#728564;margin-bottom:5px}
.editor-modal .studio-header h2{font-size:21px;letter-spacing:-.6px}
.editor-modal .studio-header p{font-size:11px;color:var(--studio-muted);margin-top:5px}
.studio-body{padding:24px 28px 20px}
.deck-settings{padding:0 2px 21px;border-bottom:1px solid var(--studio-border)}
.editor-modal .deck-settings .field-grid{grid-template-columns:minmax(0,2.2fr) minmax(170px,1fr);gap:20px}
.editor-modal .deck-settings .field{margin-bottom:0}
.editor-modal .field label{color:var(--studio-text);font-size:11px;font-weight:650;display:flex;align-items:center;gap:6px;line-height:1.6}
.required-mark{color:#9aa98f;font-size:10px}
.editor-modal .field input,.editor-modal .field textarea,.editor-modal .field select{background:var(--studio-input);border-color:var(--studio-border);color:var(--studio-text);border-radius:9px;padding:11px 13px;font-size:13px}
.editor-modal .field input::placeholder,.editor-modal .field textarea::placeholder{color:#8e9aa6;opacity:1}
.extra-deck-settings{margin-top:15px}
.extra-deck-settings summary{display:inline-flex;align-items:center;gap:9px;list-style:none;font-size:10px;font-weight:600;color:var(--studio-muted);cursor:pointer;padding:3px 0}
.extra-deck-settings summary::-webkit-details-marker{display:none}
.extra-deck-settings summary .icon{height:12px;width:12px;transform:rotate(90deg);transition:transform .2s}
.extra-deck-settings[open] summary .icon{transform:rotate(-90deg)}
.extra-deck-settings summary:hover{color:var(--studio-green)}
.extra-settings-content{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:25px;margin-top:15px}
.color-setting{display:grid;gap:8px;padding-bottom:8px}
.color-setting>span{font-size:10px;color:var(--studio-muted)}
.editor-modal .color-choice{width:24px;height:24px}
.studio-guide{display:flex;gap:15px;align-items:center;justify-content:center;margin:21px 0;color:var(--studio-muted);font-size:10px}
.studio-guide span{display:flex;align-items:center;gap:6px}
.studio-guide span .icon{height:14px;width:14px;color:#93aa7b}
.studio-guide>.icon{height:11px;width:11px;color:#b3beb3}
.editor-modal .studio-card{padding:0;overflow:hidden;background:var(--studio-panel);border:1px solid var(--studio-border);border-radius:15px;margin:0 0 20px}
.editor-modal .studio-card:last-child{margin-bottom:0}
.editor-modal .card-editor-header{margin:0;padding:15px 19px;border-bottom:1px solid var(--studio-border);display:flex;align-items:center}
.card-heading{display:flex;align-items:center;gap:11px}
.card-number{display:grid;place-items:center;width:33px;height:33px;border-radius:10px;background:#eaf0e3;color:#6b8752;font-size:12px;font-weight:750;font-variant-numeric:tabular-nums}
.editor-modal .card-heading strong{display:block;font-size:12px;color:var(--studio-text)}
.row-status{font-size:9px;color:var(--studio-muted);display:flex;align-items:center;gap:5px;margin-top:2px}
.row-status.ready{color:#5b8142}
.row-status.ready:before{content:'';display:block;width:5px;height:5px;border-radius:50%;background:#8bb86c}
.row-status.pending{color:#a77736}
.editor-modal .card-editor-header>.icon-button{min-width:32px;min-height:32px}
.editor-card-workspace{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.card-writing{padding:22px;border-right:1px solid var(--studio-border);min-width:0}
.editor-modal .field{margin-bottom:19px;gap:8px}
.field-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px}
.field-heading>label{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:650;color:var(--studio-text)}
.step-number{display:inline-grid;place-items:center;min-width:18px;height:18px;font-size:9px;color:#829471;background:#eaf0e3;border:1px solid #dde7d2;border-radius:6px;flex-shrink:0;font-variant-numeric:tabular-nums}
.editor-modal .sentence-field-group{gap:0}
.editor-modal .sentence-field{font-size:15px;line-height:1.8;min-height:102px;padding:14px 15px;resize:vertical}
.editor-modal .sentence-field-group small{font-size:9px;margin-top:8px;color:var(--studio-muted)}
.example-link{display:flex;align-items:center;gap:4px;font-size:9px;white-space:nowrap;color:#71865e;padding:3px 0}
.example-link .icon{height:12px;width:12px}
.example-link:hover{color:#46672d}
.gap-picker{margin:0 0 17px}
.selection-modes{display:inline-flex;background:#eaf0e6;border:1px solid #e1e8db;padding:3px;gap:2px;border-radius:7px}
.selection-modes button{padding:5px 8px;font-size:9px;color:#728169;border-radius:4px;min-height:26px;transition:background .15s,color .15s,box-shadow .15s}
.selection-modes button[aria-pressed="true"]{background:#fff;color:#466336;box-shadow:0 1px 3px #28382610}
.word-board{font-size:15px;line-height:2.5;padding:10px 11px;border:1px dashed #cbd9bd;border-radius:10px;background:#f3f7ed;color:var(--studio-text);white-space:pre-wrap;overflow-wrap:anywhere;min-height:70px;user-select:none}
.word-board.empty{display:flex;align-items:center;justify-content:center;text-align:center;border-color:#d9e2d1}
.word-board-placeholder{font-size:10px;line-height:1.9;color:var(--studio-muted);padding:1px 12px;max-width:290px}
.word-token{display:inline;vertical-align:baseline;padding:5px 4px;margin:0 -1px;line-height:1.8;border-radius:5px;font-size:inherit;color:inherit;border:1px solid transparent;box-decoration-break:clone;-webkit-box-decoration-break:clone;transition:background .12s,color .12s,border-color .12s}
.word-token:hover{background:#e1edd4;border-color:#b7ce9f}
.word-token.selected{background:var(--studio-selection);color:#355226;border-color:#b6cf9e}
.word-token.selection-anchor{border-color:#7fa650;box-shadow:0 0 0 2px #a0c57222}
.word-token:focus-visible{outline:2px solid #7fa650;outline-offset:2px}
.selection-helper{margin:8px 0 0;min-height:30px;font-size:9px;line-height:1.7;color:var(--studio-muted)}
.selection-helper.pending{color:#9c732f}
.selection-helper.invalid{color:#b56052}
.answer-input-wrap{position:relative;display:flex;align-items:center}
.answer-input-wrap>.icon{position:absolute;left:12px;width:15px;height:15px;color:#839871;pointer-events:none}
.editor-modal .answer-input-wrap input{padding-left:36px;padding-right:40px;color:var(--studio-green);font-weight:600;font-size:12px}
.editor-modal .answer-input-wrap input::placeholder{color:#8a9782;font-weight:400;font-size:11px}
.clear-gap{position:absolute;right:5px;display:grid;place-items:center;min-width:30px;min-height:30px;color:var(--studio-muted);border-radius:6px}
.clear-gap .icon{width:13px;height:13px}
.clear-gap:hover{background:#eaf0e5;color:#546747}
.occurrence-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:9px;color:var(--studio-muted);margin-top:2px}
.occurrence-controls>div{display:flex;gap:6px;align-items:center;flex-shrink:0;background:#edf2e8;border-radius:6px;padding:2px}
.occurrence-controls button{width:25px;height:25px;border-radius:4px;display:grid;place-items:center;color:#6f8757}
.occurrence-controls button:hover{background:#dfead4}
.occurrence-controls button:first-child .icon{transform:rotate(180deg)}
.occurrence-controls .icon{height:12px;width:12px}
.occurrence-label{font-size:9px;min-width:30px;text-align:center;font-variant-numeric:tabular-nums}
.optional-label{font-size:9px;font-weight:400;color:var(--studio-muted);margin-left:auto}
.editor-modal .translation-field-group{margin:0}
.editor-modal .translation-field-group input{font-size:11px}
.editor-preview-panel{padding:23px 20px;background:var(--studio-preview);min-width:0;display:flex;flex-direction:column}
.preview-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:24px}
.preview-panel-heading>span{display:flex;align-items:center;gap:6px;letter-spacing:1px;font-size:8px;font-weight:750;color:#8a9b7d;white-space:nowrap}
.preview-panel-heading .icon{width:13px;height:13px}
.preview-reveal{font-size:9px;color:var(--studio-green);padding:4px 0;line-height:1.5}
.preview-reveal:hover{text-decoration:underline;text-underline-offset:3px}
.preview-reveal:disabled{opacity:.45;text-decoration:none}
.editor-modal .card-preview{padding:20px 18px;border-radius:13px;background:var(--studio-preview-card);border:1px solid #dfe8d4;box-shadow:0 5px 20px #4e673009;color:var(--studio-text);min-height:280px;display:flex;flex-direction:column;line-height:1.6}
.preview-card-meta{display:flex;justify-content:space-between;align-items:center;color:#9bad88}
.preview-card-meta>span{display:flex;gap:5px;align-items:center;color:var(--studio-muted);font-size:9px}
.preview-card-meta .icon{width:14px;height:14px}
.preview-prompt{font-size:7px;font-weight:700;letter-spacing:1.05px;color:var(--studio-muted);margin-top:36px;text-align:center}
.preview-sentence{font-size:22px;font-weight:600;letter-spacing:-.3px;line-height:1.9;text-align:center;margin:14px 0 28px;white-space:pre-wrap;overflow-wrap:anywhere}
.preview-gap{display:inline-block;min-width:62px;border-radius:5px;background:#eaf3dd;color:#7ca74c;border-bottom:2px solid #9cbe77;padding:1px 9px;line-height:1.45;letter-spacing:3px;margin:0 3px}
.preview-gap.revealed{letter-spacing:0;font-size:18px;color:#4d7732}
.preview-answer-shell{padding:10px 11px;border:1px solid #e1e7dc;border-radius:7px;font-size:9px;color:#9ba594;display:flex;align-items:center;gap:8px;margin-top:auto}
.preview-answer-shell .icon{width:12px;height:12px}
.preview-translation{display:flex;align-items:start;justify-content:center;gap:5px;font-size:9px;line-height:1.8;color:var(--studio-muted);margin-top:15px;text-align:center;overflow-wrap:anywhere}
.preview-translation .icon{width:12px;height:12px;flex-shrink:0;margin-top:2px;color:#91a37e}
.preview-empty{margin:auto;display:flex;align-items:center;flex-direction:column;text-align:center;padding:24px 5px}
.preview-empty>span{width:52px;height:52px;display:grid;place-items:center;border-radius:17px;background:#edf4e5;color:#a4bb8a;margin-bottom:20px}
.preview-empty .icon{width:27px;height:27px}
.preview-empty h3{font-size:14px;letter-spacing:-.2px;margin:0 0 9px;color:var(--studio-text)}
.preview-empty p{font-size:10px;line-height:1.9;color:var(--studio-muted);margin:0;max-width:220px}
.preview-bottom-note{display:flex;align-items:start;gap:6px;margin:16px 6px 0;font-size:9px;line-height:1.8;color:var(--studio-muted)}
.preview-bottom-note .icon{width:13px;height:13px;margin-top:2px;flex-shrink:0;color:#8ca373}
.editor-modal .studio-footer{justify-content:space-between;align-items:center;padding:17px 28px;background:#fff;gap:15px}
.studio-footer-left,.studio-footer-actions{display:flex;align-items:center;gap:15px}
.editor-readiness{color:var(--studio-muted);font-size:9px;white-space:nowrap}
.editor-readiness strong{font-weight:700;color:var(--studio-green);font-variant-numeric:tabular-nums;margin-right:3px}
.editor-modal .field-error{font-size:10px;line-height:1.8;margin:12px 0 0}
html[data-theme="dark"] .editor-modal{--studio-panel:#151730;--studio-border:#2c2f57;--studio-text:#e5e6f1;--studio-muted:#a2a4c5;--studio-green:#d2ef92;--studio-selection:#373958;--studio-preview:#17192e;--studio-preview-card:#191b3a;--studio-input:#12142b}
html[data-theme="dark"] .editor-modal .studio-header{background:linear-gradient(115deg,#202238,#171834 65%)}
html[data-theme="dark"] .studio-mark{background:#31334c;color:#dcf3aa}
html[data-theme="dark"] .studio-eyebrow{color:#cbed81}
html[data-theme="dark"] .required-mark{color:#c5eb73}
html[data-theme="dark"] .studio-guide{color:#acaed0}
html[data-theme="dark"] .studio-guide span .icon{color:#c0e968}
html[data-theme="dark"] .studio-guide>.icon{color:#6b6e95}
html[data-theme="dark"] .card-number{background:#292a3f;color:#d4f098}
html[data-theme="dark"] .editor-modal .card-heading strong{color:var(--studio-text)}
html[data-theme="dark"] .row-status.ready{color:#d0ef8c}
html[data-theme="dark"] .row-status.pending{color:#e2c28e}
html[data-theme="dark"] .step-number{background:#26283d;border-color:#40425a;color:#d1ef90}
html[data-theme="dark"] .example-link{color:#d0ef8d}
html[data-theme="dark"] .selection-modes{background:#111329;border-color:#2d3057}
html[data-theme="dark"] .selection-modes button{color:#a5a7c7}
html[data-theme="dark"] .selection-modes button[aria-pressed="true"]{background:#34364b;color:#e1f5b6;box-shadow:0 1px 4px #0002}
html[data-theme="dark"] .word-board{background:#181a30;border-color:#42445a}
html[data-theme="dark"] .word-board.empty{background:#15172e;border-color:#35364a}
html[data-theme="dark"] .word-token:hover{background:#313247;border-color:#595c8a}
html[data-theme="dark"] .word-token.selected{background:#373958;color:#e7f7c4;border-color:#8b9b67}
html[data-theme="dark"] .word-token.selection-anchor{border-color:#ccee85;box-shadow:0 0 0 2px #b7e65122}
html[data-theme="dark"] .selection-helper.pending{color:#e4c38b}
html[data-theme="dark"] .selection-helper.invalid{color:#f1b0a6}
html[data-theme="dark"] .answer-input-wrap>.icon{color:#c7ec78}
html[data-theme="dark"] .editor-modal .answer-input-wrap input{color:#dcf3aa}
html[data-theme="dark"] .editor-modal .answer-input-wrap input::placeholder{color:#b9e757}
html[data-theme="dark"] .clear-gap:hover{background:#2e2f44;color:#dcf3aa}
html[data-theme="dark"] .occurrence-controls>div{background:#27293e}
html[data-theme="dark"] .occurrence-controls button{color:#d3f096}
html[data-theme="dark"] .occurrence-controls button:hover{background:#373957}
html[data-theme="dark"] .preview-panel-heading>span{color:#c6ec76}
html[data-theme="dark"] .editor-modal .card-preview{background:var(--studio-preview-card);border-color:#363851;box-shadow:0 8px 28px #0001;color:var(--studio-text)}
html[data-theme="dark"] .preview-card-meta{color:#cdee86}
html[data-theme="dark"] .preview-gap{background:#323453;border-color:#c6eb75;color:#dcf3ab}
html[data-theme="dark"] .preview-gap.revealed{color:#e7f7c6}
html[data-theme="dark"] .preview-answer-shell{border-color:#3b3d57;background:#14152d;color:#9496b8}
html[data-theme="dark"] .preview-empty>span{background:#2d2f44;color:#c4eb71}
html[data-theme="dark"] .preview-bottom-note .icon{color:#c5eb73}
html[data-theme="dark"] .editor-modal .studio-footer{background:#171834}
@media(max-width:1050px){.modal.editor-modal{max-width:940px}.editor-card-workspace{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}.card-writing{padding:19px}.editor-preview-panel{padding:21px 17px}.preview-panel-heading{align-items:start}.preview-panel-heading>span{font-size:7px;letter-spacing:.7px}.preview-reveal{font-size:8px}.preview-sentence{font-size:20px}.editor-readiness{display:none}}
@media(max-width:760px){
 .modal.editor-modal{max-height:95dvh;border-radius:17px}
 .editor-modal .studio-header{padding:20px 18px;gap:8px}
 .studio-mark{height:37px;width:37px;border-radius:11px}
 .studio-mark .icon{height:21px;width:21px}
 .studio-identity{gap:10px}
 .studio-eyebrow{font-size:8px;letter-spacing:1.2px;margin-bottom:4px}
 .editor-modal .studio-header h2{font-size:17px;letter-spacing:-.5px;line-height:1.4}
 .editor-modal .studio-header p{font-size:9px;max-width:220px;line-height:1.7}
 .studio-body{padding:19px 15px}
 .editor-modal .deck-settings .field-grid{grid-template-columns:1fr;gap:15px}
 .editor-modal .field input,.editor-modal .field textarea,.editor-modal .field select{font-size:16px}
 .editor-modal .field label{font-size:11px}
 .extra-deck-settings summary{font-size:10px;min-height:36px}
 .extra-settings-content{grid-template-columns:1fr;gap:15px}
 .color-setting{display:flex;align-items:center;justify-content:space-between;padding-bottom:0}
 .editor-modal .color-choice{width:30px;height:30px}
 .studio-guide{gap:7px;font-size:8px;margin:19px 0;justify-content:space-between}
 .studio-guide span{gap:4px}
 .studio-guide span .icon{width:12px;height:12px}
 .studio-guide>.icon{width:9px;height:9px}
 .studio-guide span:last-child{font-size:0}
 .studio-guide span:last-child:after{content:'Podgląd';font-size:8px}
 .editor-modal .card-editor-header{padding:12px 14px}
 .editor-modal .card-editor-header>.icon-button{min-width:40px;min-height:40px}
 .card-number{height:31px;width:31px;font-size:11px}
 .editor-card-workspace{grid-template-columns:1fr}
 .card-writing{padding:19px 14px;border-right:0;border-bottom:1px solid var(--studio-border)}
 .editor-modal .sentence-field{font-size:16px;min-height:115px;line-height:1.8}
 .editor-modal .sentence-field-group small{font-size:9px;line-height:1.8}
 .example-link{min-height:32px;font-size:9px}
 .field-heading{gap:7px;flex-wrap:wrap}
 .gap-picker .field-heading{align-items:center;flex-wrap:nowrap}
 .selection-modes button{font-size:10px;min-height:36px;padding:6px 9px}
 .word-board{font-size:16px;line-height:2.8;padding:9px}
 .word-token{padding:9px 5px;min-height:44px}
 .word-board-placeholder{font-size:10px;padding:7px;line-height:1.9}
 .selection-helper{font-size:10px;min-height:36px;line-height:1.8}
 .editor-modal .answer-input-wrap input{font-size:16px;padding-right:42px;line-height:1.6}
 .editor-modal .answer-input-wrap input::placeholder{font-size:11px}
 .clear-gap{min-height:36px;min-width:36px;right:3px}
 .occurrence-controls{font-size:9px;align-items:center;gap:7px}
 .occurrence-controls>span{max-width:145px;line-height:1.8}
 .occurrence-controls button{height:36px;width:30px}
 .editor-modal .translation-field-group input{font-size:16px}
 .optional-label{font-size:8px}
 .editor-preview-panel{padding:22px 17px}
 .preview-panel-heading{align-items:center;margin-bottom:17px;gap:10px}
 .preview-panel-heading>span{font-size:8px;letter-spacing:.8px}
 .preview-reveal{font-size:10px;min-height:32px}
 .editor-modal .card-preview{padding:20px 15px;min-height:250px}
 .preview-sentence{font-size:22px}
 .preview-gap.revealed{font-size:18px}
 .preview-prompt{font-size:7px;margin-top:30px}
 .preview-card-meta>span{font-size:9px}
 .preview-answer-shell{font-size:10px}
 .preview-translation{font-size:10px}
 .preview-bottom-note{font-size:9px;margin-top:14px}
 .editor-modal .studio-footer{padding:13px 15px;gap:8px;align-items:center;flex-wrap:wrap}
 .studio-footer-left{gap:0}
 .studio-footer-actions{gap:2px;margin-left:auto}
 .studio-footer .button{font-size:10px;min-height:44px;padding:10px 12px;gap:6px}
 .studio-footer .button .icon{width:14px;height:14px}
 .studio-footer .button.ghost{font-size:9px;padding:8px}
 .editor-modal .field-error{font-size:11px}
}
@media(max-width:380px){.studio-footer .button{padding:10px 9px;font-size:9px}.studio-footer .button.ghost{padding:6px}.studio-header .studio-mark{display:none}.editor-modal .studio-header h2{font-size:18px}.studio-guide{gap:5px}.selection-modes button{padding:6px 7px}}
.editor-modal .studio-header{position:sticky;top:0;z-index:4}
@media(max-width:760px){
 .selection-modes button{min-height:44px}
 .editor-modal .card-editor-header>.icon-button{min-width:44px;min-height:44px}
 .preview-reveal,.example-link,.extra-deck-settings summary{min-height:44px}
 .clear-gap{min-width:40px;min-height:44px}
 .occurrence-controls{flex-wrap:wrap}
 .occurrence-controls>span{max-width:none}
 .occurrence-controls button{height:44px;width:40px}
}
@media(min-width:761px){
 .modal.editor-modal{max-height:94dvh}
 .editor-modal .studio-header{padding:20px 25px}
 .studio-body{padding:20px 25px 16px}
 .deck-settings{padding-bottom:16px}
 .extra-deck-settings{margin-top:10px}
 .studio-guide{margin:16px 0}
 .editor-modal .card-editor-header{padding:12px 17px}
 .card-writing{padding:18px}
 .editor-modal .field{margin-bottom:16px}
 .editor-modal .sentence-field{min-height:86px}
 .gap-picker{margin-bottom:14px}
 .word-board{min-height:60px;padding:8px 10px}
 .selection-helper{min-height:18px;margin-top:6px}
 .editor-modal .translation-field-group{margin-bottom:0}
 .editor-preview-panel{padding:20px 18px}
 .editor-modal .studio-footer{padding:15px 25px}
}
/* The preview follows the study order: full Polish sentence, then the gap. */
.preview-polish{padding:12px 13px;background:#f0f1fa;border:1px solid #e1e4f1;border-radius:9px;margin:13px 0 17px;text-align:left;overflow-wrap:anywhere}
.preview-polish>span{font-size:8px;font-weight:750;letter-spacing:.8px;color:#7c7d9b}
.preview-polish>p{font-size:13px;line-height:1.8;color:#535c77;margin:5px 0 0;white-space:pre-wrap}
html[data-theme="dark"] .preview-polish{background:#262847;border-color:#3b3e64}
html[data-theme="dark"] .preview-polish>span{color:#babcd8}
html[data-theme="dark"] .preview-polish>p{color:#dcddec}
