/* generated by html-guide/build.py from markdown/app/static/sheet.css and app.css, every rule confined to the guide's article (engine/cssscope.py) -- do not edit */ @font-face{font-family: "TeX Gyre Pagella"; font-weight: 400; font-style: normal; src: url(fonts/texgyrepagella-regular.otf) format("opentype");} @font-face{font-family: "TeX Gyre Pagella"; font-weight: 700; font-style: normal; src: url(fonts/texgyrepagella-bold.otf) format("opentype");} @font-face{font-family: "TeX Gyre Pagella"; font-weight: 400; font-style: italic; src: url(fonts/texgyrepagella-italic.otf) format("opentype");} @font-face{font-family: "TeX Gyre Pagella"; font-weight: 700; font-style: italic; src: url(fonts/texgyrepagella-bolditalic.otf) format("opentype");} @font-face{font-family: "TeX Gyre Heros"; font-weight: 400; font-style: normal; src: url(fonts/texgyreheros-regular.otf) format("opentype");} @font-face{font-family: "TeX Gyre Heros"; font-weight: 700; font-style: normal; src: url(fonts/texgyreheros-bold.otf) format("opentype");} @font-face{font-family: "TeX Gyre Heros"; font-weight: 400; font-style: italic; src: url(fonts/texgyreheros-italic.otf) format("opentype");} @font-face{font-family: "Vazirmatn"; font-weight: 400; src: url(fonts/Vazirmatn-Regular.ttf) format("truetype");} @font-face{font-family: "Vazirmatn"; font-weight: 700; src: url(fonts/Vazirmatn-Bold.ttf) format("truetype");} @font-face{font-family: "Noto Nastaliq Urdu"; font-weight: 400; font-display: swap; src: url(fonts/NotoNastaliqUrdu.woff2) format("woff2"), url(fonts/NotoNastaliqUrdu.ttf) format("truetype");} @font-face{font-family: "Noto Naskh Arabic"; font-weight: 400; font-display: swap; src: url(fonts/NotoNaskhArabic.woff2) format("woff2");} @font-face{font-family: "Noto Serif Devanagari"; font-weight: 400; font-display: swap; src: url(fonts/NotoSerifDevanagari.woff2) format("woff2");} :is(.pz,.modal-overlay){--accent: #be3455; --accentlt: #ce5b78; --accent-fg:#ffffff; --rulec: #e3d9dd; --graytx: #635358; --boxbg: #faf4f6; --ink: #241e21; --sheet-bg: #ffffff; --chrome-bg: #f3eff1; --chrome-panel: #ffffff; --chrome-fg: #2f272b; --chrome-mut: #635358; --chrome-line: #e3d9dd; --danger: #9b3327; --danger-fg:#ffffff; --ok: #2e7d4f; --warn: #a8760a; --serif: "TeX Gyre Pagella", "Palatino Linotype", Palatino, Georgia, serif; --sans: "TeX Gyre Heros", "Helvetica Neue", Helvetica, Arial, sans-serif; --fa-font: var(--tl-font-fa, serif);} :is(.pz,.modal-overlay) [data-lang]{--fa-font: var(--tl-font);} :is(.pz,.modal-overlay) .sheet[data-lang]{--fa-font: var(--tl-font);} html[data-sheet="sepia"] :is(.pz,.modal-overlay){--sheet-bg:#f8f2e2; --ink:#3c3425; --boxbg:#efe7d1; --rulec:#d8cdb2; --graytx:#6f6653; --chrome-bg:#ece5d4; --chrome-panel:#f8f3e6; --chrome-fg:#3c3425; --chrome-line:#d8cfba; --chrome-mut:#7a7057;} html[data-sheet="dark"] :is(.pz,.modal-overlay){--sheet-bg:#211a1d; --ink:#e6dade; --boxbg:#2a2024; --rulec:#382c31; --graytx:#ac9ba1; --accent:#ee8aa3; --accentlt:#d97c93; --accent-fg:#171214; --danger:#e79b84; --danger-fg:#171214; --ok:#6fbf8b; --warn:#dda653; --chrome-bg:#171214; --chrome-panel:#211a1d; --chrome-fg:#dbcdd2; --chrome-line:#382c31; --chrome-mut:#ac9ba1;} :is(.pz,.modal-overlay) *{box-sizing: border-box;} :is(.pz,.modal-overlay){margin: 0; min-height: 100%; background: var(--chrome-bg); color: var(--chrome-fg); font: 14px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;} :is(.pz,.modal-overlay) a{color: var(--accentlt);} :is(.pz,.modal-overlay) button{font: inherit;} :is(.pz,.modal-overlay) .hidden{display: none !important;} :is(.pz,.modal-overlay) [hidden]{display: none !important;} :is(.pz,.modal-overlay) .sheet{--fa-scale: 1.52; --voce-scale: 3.4; font-family: var(--serif); font-size: var(--base-size, 17px); line-height: var(--leading, 1.45); color: var(--ink); background: var(--sheet-bg); max-width: var(--sheet-width, 720px); margin: 1.6rem auto 4rem; padding: clamp(1.6rem, 4vw, 3.4rem) clamp(1.3rem, 5vw, 4rem); border-radius: 3px; box-shadow: 0 1px 3px rgba(0,0,0,.14), 0 10px 34px rgba(0,0,0,.10); overflow-wrap: break-word;} :is(.pz,.modal-overlay) .sheet p{margin: 0 0 .85em;} :is(.pz,.modal-overlay) .sheet.justify p,:is(.pz,.modal-overlay) .sheet.justify dd,:is(.pz,.modal-overlay) .sheet.justify li{text-align: justify; hyphens: auto; -webkit-hyphens: auto;} :is(.pz,.modal-overlay) .sheet .fa{font-family: var(--fa-font); font-size: calc(var(--fa-scale) * 1em); line-height: 1.12; white-space: nowrap; unicode-bidi: isolate; cursor: copy;} :is(.pz,.modal-overlay) .sheet .fa-l{white-space: normal;} :is(.pz,.modal-overlay) .sheet .fa-b{font-weight: 700;} :is(.pz,.modal-overlay) .sheet .fa:hover{background: color-mix(in srgb, var(--accentlt) 14%, transparent); border-radius: 3px;} :is(.pz,.modal-overlay) .fa-display{padding-left: 1.5em; margin: 1.05em 0;} :is(.pz,.modal-overlay) .fa-display .fa{font-size: calc(var(--fa-scale) * 1.2em);} :is(.pz,.modal-overlay) .sheet .fa-par{font-family: var(--fa-font); font-size: calc(var(--fa-scale) * 1em); line-height: 1.75; margin: .9em 0;} :is(.pz,.modal-overlay) .sheet .fa-par[dir="rtl"]{text-align: right;} :is(.pz,.modal-overlay) .sheet .fa-par[dir="ltr"]{text-align: left;} :is(.pz,.modal-overlay) .sheet.justify .fa-par[dir="rtl"]{text-align: right;} :is(.pz,.modal-overlay) .sheet.justify .fa-par[dir="ltr"]{text-align: left;} :is(.pz,.modal-overlay) .sheet .fa-rich{unicode-bidi: isolate;} :is(.pz,.modal-overlay) .sheet .tl-vertical{writing-mode: vertical-rl; text-orientation: mixed; height: var(--tl-vh, 22em); max-width: 100%; overflow-x: auto; overflow-y: hidden; direction: ltr; text-align: left; margin: 1em auto; line-height: 1.9;} :is(.pz,.modal-overlay) .sheet.justify .tl-vertical{text-align: left;} :is(.pz,.modal-overlay){--rtlbg-quote:#EEF3F6; --rtlbg-sand:#F5EDDC; --rtlbg-rose:#F7E8E8; --rtlbg-sage:#EAF2E6; --rtlbg-lilac:#EFEAF6;} html[data-sheet="dark"] :is(.pz,.modal-overlay){--rtlbg-quote:#2A3640; --rtlbg-sand:#3B3425; --rtlbg-rose:#3D2B2E; --rtlbg-sage:#2C372B; --rtlbg-lilac:#332C3F;} :is(.pz,.modal-overlay) .sheet .fa-alt,:is(.pz,.modal-overlay) .sheet .fa-nasta{font-family: var(--tl-alt, var(--fa-font)); line-height: max(calc(var(--tl-alt-lh, 1) - .2), 1.75);} :is(.pz,.modal-overlay) .rtl-bg-quote{background: var(--rtlbg-quote);} :is(.pz,.modal-overlay) .rtl-bg-sand{background: var(--rtlbg-sand);} :is(.pz,.modal-overlay) .rtl-bg-rose{background: var(--rtlbg-rose);} :is(.pz,.modal-overlay) .rtl-bg-sage{background: var(--rtlbg-sage);} :is(.pz,.modal-overlay) .rtl-bg-lilac{background: var(--rtlbg-lilac);} :is(.pz,.modal-overlay) .fa-par[class*="rtl-bg-"]{padding: .55em .85em; border-radius: 6px;} :is(.pz,.modal-overlay) .fa-rich[class*="rtl-bg-"]{padding: .08em .35em; border-radius: 4px; box-decoration-break: clone; -webkit-box-decoration-break: clone;} :is(.pz,.modal-overlay) .sheet .la-par{margin: .9em 0; max-width: 125%;} :is(.pz,.modal-overlay) .sheet .la-par.align-center{text-align: center;} :is(.pz,.modal-overlay) .sheet .la-par.align-right{text-align: right;} :is(.pz,.modal-overlay) .sheet.justify .la-par.align-left{text-align: justify; hyphens: auto; -webkit-hyphens: auto;} :is(.pz,.modal-overlay) .la-par[class*="rtl-bg-"]{padding: .55em .85em; border-radius: 6px;} body[data-page="doc"] :is(.pz,.modal-overlay) .la-par,body[data-page="edit"] :is(.pz,.modal-overlay) .la-par{cursor: pointer;} body[data-page="doc"] :is(.pz,.modal-overlay) .la-par:hover,body[data-page="edit"] :is(.pz,.modal-overlay) .la-par:hover{outline: 2px solid color-mix(in srgb, var(--accentlt) 45%, transparent); outline-offset: 3px; border-radius: 4px;} :is(.pz,.modal-overlay) .la-par.img-editing{outline: 2px solid var(--accent) !important; outline-offset: 3px;} :is(.pz,.modal-overlay) .imgpanel .bgsel select{flex: 1; padding: .2rem .3rem; border-radius: 5px; border: 1px solid var(--chrome-line); background: var(--chrome-bg); color: var(--chrome-fg); font-size: .76rem;} :is(.pz,.modal-overlay) .sheet .eq{color: var(--graytx);} :is(.pz,.modal-overlay) .sheet .arrow{font-family: var(--serif);} :is(.pz,.modal-overlay) .sheet code{font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .88em; background: color-mix(in srgb, var(--graytx) 10%, transparent); padding: .05em .25em; border-radius: 3px;} :is(.pz,.modal-overlay) .titleblock{text-align: center; margin-bottom: 2.2em;} :is(.pz,.modal-overlay) .titleblock h1{font-family: var(--sans); font-weight: 700; color: var(--accent); font-size: 2.1em; margin: 0 0 .25em; line-height: 1.2;} :is(.pz,.modal-overlay) .titleblock .subtitle{font-family: var(--sans); color: var(--accentlt); font-size: 1.12em; margin: 0 0 .9em;} :is(.pz,.modal-overlay) .titleblock .titlerule{width: 55%; height: 1px; background: var(--rulec); margin: 0 auto .8em;} :is(.pz,.modal-overlay) .titleblock .tnote{font-size: .82em; color: var(--graytx); margin: 0;} :is(.pz,.modal-overlay) .sheet h2.section{font-family: var(--sans); font-weight: 700; color: var(--accent); font-size: 1.42em; line-height: 1.25; margin: 1.7em 0 .55em;} :is(.pz,.modal-overlay) .sheet h2.section .secnum{margin-right: .15em;} :is(.pz,.modal-overlay) .sheet h3.subsection{font-family: var(--sans); font-weight: 700; color: var(--accentlt); font-size: 1.16em; margin: 1.4em 0 .45em;} :is(.pz,.modal-overlay) .voce{margin: 2.1em 0 1.1em;} :is(.pz,.modal-overlay) .voce-head{display: flex; justify-content: space-between; align-items: flex-end; gap: 1em; padding: .45em 0 .55em; border-top: 2px solid var(--rulec); border-bottom: 1px solid var(--rulec);} :is(.pz,.modal-overlay) .voce-fa{font-family: var(--fa-font); font-size: calc(var(--voce-scale) * 1em); line-height: 1.08; flex: 1 1 58%; cursor: copy;} :is(.pz,.modal-overlay) .voce-side{text-align: right; flex: 0 1 40%;} :is(.pz,.modal-overlay) .voce-kana{font-family: var(--fa-font); font-size: 1.05em; color: var(--graytx); line-height: 1.4;} :is(.pz,.modal-overlay) .voce-translit{font-style: italic; color: var(--accent); font-size: 1.14em;} :is(.pz,.modal-overlay) .voce-etym{font-size: .8em; color: var(--graytx); margin-top: .25em; line-height: 1.4;} :is(.pz,.modal-overlay) .box{background: var(--boxbg); width: 94%; margin: 1.3em auto; padding: .9em 1.15em; border-radius: 3px; text-align: left;} :is(.pz,.modal-overlay) .box p:last-child{margin-bottom: 0;} :is(.pz,.modal-overlay) .sheet ul,:is(.pz,.modal-overlay) .sheet ol{margin: .5em 0 .9em; padding-left: 1.5em;} :is(.pz,.modal-overlay) .sheet li{margin: .22em 0;} :is(.pz,.modal-overlay) .sheet ul ul{margin: .15em 0 .15em;} :is(.pz,.modal-overlay) dl.desc,:is(.pz,.modal-overlay) dl.lex{margin: .6em 0 1em;} :is(.pz,.modal-overlay) dl.desc .di{margin: .4em 0;} :is(.pz,.modal-overlay) dl.desc dt{display: inline; font-weight: 700;} :is(.pz,.modal-overlay) dl.desc dt::after{content: " ";} :is(.pz,.modal-overlay) dl.desc dd{display: inline; margin: 0;} :is(.pz,.modal-overlay) dl.lex .di{margin: .75em 0;} :is(.pz,.modal-overlay) dl.lex dt{display: block; font-weight: 700;} :is(.pz,.modal-overlay) dl.lex dd{display: block; margin: .15em 0 0 1.5em;} :is(.pz,.modal-overlay) .tablewrap{overflow-x: auto; margin: 1.25em 0;} :is(.pz,.modal-overlay) table.bt{margin: 0 auto; border-collapse: collapse; border-top: 2px solid var(--ink); border-bottom: 2px solid var(--ink); line-height: 1.45;} :is(.pz,.modal-overlay) table.bt thead th{border-bottom: 1px solid var(--ink); font-weight: 700; padding: .5em .55em .4em;} :is(.pz,.modal-overlay) table.bt td{padding: .42em .55em;} :is(.pz,.modal-overlay) table.bt .a-l{text-align: left;} :is(.pz,.modal-overlay) table.bt .a-c{text-align: center;} :is(.pz,.modal-overlay) table.bt .a-r{text-align: right;} :is(.pz,.modal-overlay) table.bt.t-sm{font-size: .9em;} :is(.pz,.modal-overlay) table.bt.t-fn{font-size: .8em;} :is(.pz,.modal-overlay) table.bt .fa{white-space: nowrap;} :is(.pz,.modal-overlay) .fn{position: relative;} :is(.pz,.modal-overlay) .sheet .fnref{font-size: .68em; line-height: 0; vertical-align: super; color: var(--accent); font-weight: 700; cursor: help; padding: 0 .1em; font-feature-settings: "onum" 0;} :is(.pz,.modal-overlay) .sheet .fnref:hover,:is(.pz,.modal-overlay) .sheet .fnref:focus{text-decoration: underline;} :is(.pz,.modal-overlay) .fncloud{position: absolute; z-index: 60; left: 50%; bottom: calc(100% + .55em); transform: translateX(calc(-50% + var(--fn-shift, 0px))); width: max-content; max-width: min(30em, 82vw); background: var(--sheet-bg); color: var(--ink); border: 1px solid var(--rulec); border-radius: 8px; box-shadow: 0 8px 30px rgba(0,0,0,.22); padding: .6em .8em; font-size: .82em; line-height: 1.5; text-align: left; text-indent: 0; font-style: normal; font-weight: 400; display: none; animation: fncloud-in .13s; pointer-events: none;} @keyframes fncloud-in{from { opacity: 0; } to { opacity: 1; }} :is(.pz,.modal-overlay) .fncloud::after{content: ""; position: absolute; top: 100%; left: 50%; margin-left: calc(-6px - var(--fn-shift, 0px)); border: 6px solid transparent; border-top-color: var(--rulec);} :is(.pz,.modal-overlay) .fn:hover .fncloud,:is(.pz,.modal-overlay) .fnref:focus + .fncloud{display: block;} :is(.pz,.modal-overlay) .fncloud .fa{font-size: calc(var(--fa-scale) * .95em);} :is(.pz,.modal-overlay) .fncloud p{margin: 0;} :is(.pz,.modal-overlay) .fn.fn-below .fncloud{bottom: auto; top: calc(100% + .55em);} :is(.pz,.modal-overlay) .fn.fn-below .fncloud::after{top: auto; bottom: 100%; border-top-color: transparent; border-bottom-color: var(--rulec);} :is(.pz,.modal-overlay) .footnotes{margin-top: 2.4em; padding-top: .8em; border-top: 1px solid var(--rulec); font-size: .82em; color: var(--ink);} :is(.pz,.modal-overlay) .footnotes h4{margin: 0 0 .4em; font-family: var(--sans); font-size: 1em; color: var(--graytx); font-weight: 700;} :is(.pz,.modal-overlay) .footnotes ol{margin: 0; padding-left: 1.6em;} :is(.pz,.modal-overlay) .footnotes li{margin: .3em 0; line-height: 1.5;} :is(.pz,.modal-overlay) .sheet a.lnk{color: var(--accent); text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--accent) 38%, transparent);} :is(.pz,.modal-overlay) .sheet a.lnk:hover{border-bottom-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent);} :is(.pz,.modal-overlay) .sheet a.lnk::after{content: "↗"; font-size: .72em; vertical-align: super; opacity: .5; margin-left: .1em;} :is(.pz,.modal-overlay) .sheet a.doclink{color: var(--accent); text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--accent) 38%, transparent);} :is(.pz,.modal-overlay) .sheet a.doclink:hover{border-bottom-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, transparent);} :is(.pz,.modal-overlay) .sheet a.doclink::after{content: "→"; font-size: .78em; vertical-align: baseline; opacity: .55; margin-left: .15em;} :is(.pz,.modal-overlay) .sheet .doclink-dead{color: var(--danger); cursor: help; border-bottom: 1px dashed color-mix(in srgb, var(--danger) 55%, transparent);} :is(.pz,.modal-overlay) .sheet .doclink-dead::after{content: "⚠"; font-size: .74em; vertical-align: super; opacity: .7; margin-left: .15em;} :is(.pz,.modal-overlay) .sheet .exercise{position: relative; margin: 1.25em 0; padding: 1em 1.05em; border: 1px solid var(--rulec); border-radius: 12px; background: color-mix(in srgb, var(--boxbg) 62%, var(--sheet-bg)); transition: border-color .15s, background .15s;} :is(.pz,.modal-overlay) .sheet .exercise.correct{border-color: color-mix(in srgb, var(--ok) 65%, var(--rulec)); background: color-mix(in srgb, var(--ok) 8%, var(--sheet-bg));} :is(.pz,.modal-overlay) .sheet .exercise.incorrect{border-color: color-mix(in srgb, var(--danger) 65%, var(--rulec)); background: color-mix(in srgb, var(--danger) 7%, var(--sheet-bg));} :is(.pz,.modal-overlay) .ex-head{display: flex; align-items: center; gap: .5em; margin-bottom: .5em;} :is(.pz,.modal-overlay) .ex-kicker{font: 700 .68em/1.2 var(--sans); text-transform: uppercase; letter-spacing: .09em; color: var(--accent);} :is(.pz,.modal-overlay) .ex-edit{margin-left: auto; padding: .18em .5em; border: 1px solid var(--rulec); border-radius: 5px; background: var(--sheet-bg); color: var(--graytx); font: .72em/1.2 var(--sans); cursor: pointer;} :is(.pz,.modal-overlay) .ex-edit:hover{color: var(--accent); border-color: var(--accent);} :is(.pz,.modal-overlay) .ex-to-deck{margin-left: auto; padding: .18em .5em; border: 1px solid var(--rulec); border-radius: 5px; background: var(--sheet-bg); color: var(--graytx); font: .72em/1.2 var(--sans); cursor: pointer;} :is(.pz,.modal-overlay) .ex-to-deck:hover{color: var(--accent); border-color: var(--accent);} :is(.pz,.modal-overlay) .ex-card-zoom{margin-left: auto; padding: .18em .5em; border: 1px solid var(--rulec); border-radius: 5px; background: var(--sheet-bg); color: var(--graytx); font: .72em/1.2 var(--sans); cursor: pointer;} :is(.pz,.modal-overlay) .ex-card-zoom:hover{color: var(--accent); border-color: var(--accent);} :is(.pz,.modal-overlay) .ex-card-zoom ~ .ex-edit,:is(.pz,.modal-overlay) .ex-card-zoom ~ .ex-to-deck{margin-left: 0;} :is(.pz,.modal-overlay) .ex-translit-switch{margin-left: auto; padding: .18em .5em; border: 1px solid var(--rulec); border-radius: 5px; background: var(--sheet-bg); color: var(--graytx); font: .72em/1.2 var(--sans); cursor: pointer;} :is(.pz,.modal-overlay) .ex-translit-switch:hover,:is(.pz,.modal-overlay) .ex-translit-switch[aria-pressed="true"]{color: var(--accent); border-color: var(--accentlt);} :is(.pz,.modal-overlay) .ex-translit-switch ~ .ex-card-zoom,:is(.pz,.modal-overlay) .ex-translit-switch ~ .ex-edit,:is(.pz,.modal-overlay) .ex-translit-switch ~ .ex-to-deck{margin-left: 0;} :is(.pz,.modal-overlay) .ex-drag-switch{margin-left: auto; padding: .18em .5em; border: 1px solid var(--rulec); border-radius: 5px; background: var(--sheet-bg); color: var(--graytx); font: .72em/1.2 var(--sans); cursor: pointer;} :is(.pz,.modal-overlay) .ex-drag-switch:hover{color: var(--accent); border-color: var(--accent);} :is(.pz,.modal-overlay) .ex-drag-switch[aria-pressed="true"]{color: var(--accent); border-color: var(--accentlt);} :is(.pz,.modal-overlay) .ex-drag-switch ~ .ex-edit,:is(.pz,.modal-overlay) .ex-drag-switch ~ .ex-to-deck,:is(.pz,.modal-overlay) .ex-drag-switch ~ .ex-card-zoom{margin-left: 0;} :is(.pz,.modal-overlay) .exercise.no-drag .ex-sequence > .ex-item,:is(.pz,.modal-overlay) .exercise.no-drag .ex-sequence-inline > .ex-item{cursor: default;} :is(.pz,.modal-overlay) .ex-to-deck-modal{width: min(520px, 94vw);} :is(.pz,.modal-overlay) .ex-to-deck-modal .modal-field select,:is(.pz,.modal-overlay) .ex-all-modal .modal-field select,:is(.pz,.modal-overlay) .header-modal .modal-field select{border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg); color: var(--chrome-fg); padding: .4rem .6rem; font-size: .9rem;} :is(.pz,.modal-overlay) .ex-all-modal{width: min(640px, 94vw);} :is(.pz,.modal-overlay) .ex-all-head{display: flex; align-items: center; gap: .4rem; font-size: .82rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .ex-all-head [data-x="count"]{margin-right: auto; font-variant-numeric: tabular-nums;} :is(.pz,.modal-overlay) .ex-all-list{display: flex; flex-direction: column; overflow-y: auto; min-height: 3rem; max-height: 42vh; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg);} :is(.pz,.modal-overlay) .ex-all-item{display: grid; grid-template-columns: auto 1.6em auto minmax(0, 1fr); align-items: baseline; gap: .55rem; padding: .4rem .65rem; border-top: 1px solid var(--chrome-line); font-size: .86rem; color: var(--chrome-fg); cursor: pointer;} :is(.pz,.modal-overlay) .ex-all-item:first-child{border-top: none;} :is(.pz,.modal-overlay) .ex-all-item[hidden]{display: none;} :is(.pz,.modal-overlay) .ex-all-gloss-toggle{margin: .45rem 0;} :is(.pz,.modal-overlay) .ex-all-item:hover{background: color-mix(in srgb, var(--accent) 6%, transparent);} :is(.pz,.modal-overlay) .ex-all-item input,:is(.pz,.modal-overlay) .ex-all-again input{margin: 0; accent-color: var(--accent); align-self: center;} :is(.pz,.modal-overlay) .ex-all-num{color: var(--chrome-mut); font-variant-numeric: tabular-nums; text-align: right;} :is(.pz,.modal-overlay) .ex-all-kind{font: 700 .64rem/1.2 var(--sans); text-transform: uppercase; letter-spacing: .08em; color: var(--accent); white-space: nowrap;} :is(.pz,.modal-overlay) .ex-all-text{overflow: hidden; text-overflow: ellipsis; white-space: nowrap; unicode-bidi: isolate; text-align: start;} :is(.pz,.modal-overlay) .ex-all-again{display: flex; align-items: center; gap: .4rem; font-size: .82rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .ex-all-progress{margin-right: auto; font-size: .82rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .ex-prompt{margin: .25em 0 .8em; font-weight: 700;} :is(.pz,.modal-overlay) .ex-prompt .ex-no-bold{font-weight: 400;} :is(.pz,.modal-overlay) .ex-body{display: flex; flex-direction: column; gap: .75em;} :is(.pz,.modal-overlay) .ex-body[dir]{unicode-bidi: isolate;} :is(.pz,.modal-overlay) .ex-options,:is(.pz,.modal-overlay) .ex-bank{display: flex; flex-wrap: wrap; align-items: stretch; gap: .5em;} :is(.pz,.modal-overlay) .ex-choice-group + .ex-choice-group{margin-top: .85em;} :is(.pz,.modal-overlay) .ex-question{margin-bottom: .45em;} :is(.pz,.modal-overlay) .ex-option,:is(.pz,.modal-overlay) .ex-item{border: 1px solid var(--rulec); border-radius: 8px; background: var(--sheet-bg); color: var(--ink); padding: .48em .7em; font: inherit; line-height: 1.35; cursor: pointer; text-align: start; unicode-bidi: isolate; touch-action: manipulation;} :is(.pz,.modal-overlay) .ex-field-line,:is(.pz,.modal-overlay) .ex-target-block{display: block; width: 100%;} :is(.pz,.modal-overlay) .ex-target-block{text-align: start; unicode-bidi: isolate;} :is(.pz,.modal-overlay) .ex-inline-image{display: inline-block; max-width: min(100%, 10em); max-height: 8em; width: auto; height: auto; object-fit: contain; vertical-align: middle; border-radius: 6px;} :is(.pz,.modal-overlay) .ex-inline-image-placeholder{color: var(--graytx); font: .72em var(--sans);} :is(.pz,.modal-overlay) .ex-option:hover,:is(.pz,.modal-overlay) .ex-item:hover{border-color: var(--accentlt);} :is(.pz,.modal-overlay) .ex-option.selected{border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent);} :is(.pz,.modal-overlay) .ex-option.selected::before{content: "●"; color: var(--accent); margin-inline-end: .4em;} :is(.pz,.modal-overlay) [data-choice="multiple"] .ex-option.selected::before{content: "✓";} :is(.pz,.modal-overlay) .ex-item{cursor: grab; user-select: none;} :is(.pz,.modal-overlay) .ex-sequence > .ex-item,:is(.pz,.modal-overlay) .ex-sequence-inline > .ex-item{display: inline-flex; align-items: center; gap: .4em;} :is(.pz,.modal-overlay) .ex-sequence > .ex-item > span{flex: 1 1 auto;} :is(.pz,.modal-overlay) .ex-move{flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; min-width: 2.2em; min-height: 2.2em; padding: 0; border: 1px solid var(--rulec); border-radius: 6px; background: var(--sheet-bg); color: var(--ink); font: .85em/1 var(--sans); cursor: pointer; touch-action: manipulation;} :is(.pz,.modal-overlay) .ex-move:hover:not(:disabled){border-color: var(--accentlt);} :is(.pz,.modal-overlay) .ex-move:focus-visible{outline: 2px solid var(--accent); outline-offset: 2px;} :is(.pz,.modal-overlay) .ex-move:disabled{opacity: .3; cursor: default;} :is(.pz,.modal-overlay) .ex-sequence > .ex-item > .ex-move[data-move="earlier"]::before{content: "↑";} :is(.pz,.modal-overlay) .ex-sequence > .ex-item > .ex-move[data-move="later"]::before{content: "↓";} :is(.pz,.modal-overlay) .ex-sequence-inline > .ex-item > .ex-move[data-move="earlier"]::before{content: "←";} :is(.pz,.modal-overlay) .ex-sequence-inline > .ex-item > .ex-move[data-move="later"]::before{content: "→";} :is(.pz,.modal-overlay) .ex-sequence-inline:dir(rtl) > .ex-item > .ex-move[data-move="earlier"]::before{content: "→";} :is(.pz,.modal-overlay) .ex-sequence-inline:dir(rtl) > .ex-item > .ex-move[data-move="later"]::before{content: "←";} :is(.pz,.modal-overlay) .ex-item.dragging{opacity: .45;} :is(.pz,.modal-overlay) .ex-item.picked{border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb,var(--accent) 24%,transparent);} :is(.pz,.modal-overlay) .ex-fill{line-height: 2.65;} :is(.pz,.modal-overlay) .ex-fill[dir]{unicode-bidi: isolate; text-align: start;} :is(.pz,.modal-overlay) .ex-blank,:is(.pz,.modal-overlay) .ex-match-drop{display: inline-flex; vertical-align: middle; align-items: center; min-width: 6em; min-height: 2.25em; margin: 0 .15em; padding: .18em; border: 1px dashed var(--accentlt); border-radius: 8px; background: color-mix(in srgb,var(--accent) 4%,var(--sheet-bg));} :is(.pz,.modal-overlay) .ex-blank:empty::after{content: attr(data-slot); margin: auto; color: var(--graytx); opacity: .45; font: .72em var(--sans);} :is(.pz,.modal-overlay) .ex-bank{min-height: 2.6em; padding: .45em; border-radius: 9px; background: color-mix(in srgb,var(--rulec) 35%,transparent);} :is(.pz,.modal-overlay) .ex-cloud{position: absolute; z-index: 30; left: 0; top: 0; display: flex; flex-wrap: wrap; align-items: stretch; gap: 8px; width: max-content; max-width: calc(100% - 16px); box-sizing: border-box; padding: 10px; border: 1px solid var(--rulec); border-radius: 14px; background: var(--sheet-bg); color: var(--ink); line-height: 1.35; box-shadow: 0 10px 28px rgba(0,0,0,.22), 0 2px 6px rgba(0,0,0,.12); animation: ex-cloud-in .12s ease-out;} @keyframes ex-cloud-in{from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; }} :is(.pz,.modal-overlay) .ex-cloud::before{content: ""; position: absolute; top: -7px; left: var(--tip, 50%); width: 12px; height: 12px; margin-left: -6px; transform: rotate(45deg); background: inherit; border-top: 1px solid var(--rulec); border-left: 1px solid var(--rulec);} :is(.pz,.modal-overlay) .ex-cloud.over::before{top: auto; bottom: -7px; border: 0; border-right: 1px solid var(--rulec); border-bottom: 1px solid var(--rulec);} :is(.pz,.modal-overlay) .ex-cloud.apart::before{display: none;} :is(.pz,.modal-overlay) .ex-cloud-pick,:is(.pz,.modal-overlay) .ex-cloud-clear{display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; box-sizing: border-box; padding: .35em .85em; border: 1px solid var(--rulec); border-radius: 10px; background: var(--sheet-bg); color: var(--ink); font: inherit; line-height: 1.35; cursor: pointer; unicode-bidi: isolate; touch-action: manipulation; -webkit-tap-highlight-color: transparent;} :is(.pz,.modal-overlay) .ex-cloud-pick:hover,:is(.pz,.modal-overlay) .ex-cloud-clear:hover{border-color: var(--accentlt);} :is(.pz,.modal-overlay) .ex-cloud-pick:active,:is(.pz,.modal-overlay) .ex-cloud-clear:active{border-color: var(--accent); background: color-mix(in srgb,var(--accent) 8%,var(--sheet-bg));} :is(.pz,.modal-overlay) .ex-cloud-pick:focus-visible,:is(.pz,.modal-overlay) .ex-cloud-clear:focus-visible{outline: 2px solid var(--accent); outline-offset: 2px;} :is(.pz,.modal-overlay) .ex-cloud-clear{flex: 1 1 100%; border-style: dashed; color: var(--graytx); font: .9em var(--sans);} :is(.pz,.modal-overlay) .ex-cloud-none{margin: 0; max-width: 20em; color: var(--graytx); font: .9em/1.4 var(--sans);} @media (pointer: fine){ html:not([data-mode=mobile]) :is(.pz,.modal-overlay) :is(.ex-cloud-pick, .ex-cloud-clear){min-width: 2.3em; min-height: 2.3em; padding: .3em .7em; border-radius: 8px;} } :is(.pz,.modal-overlay) .exercise:not([data-editor-preview]):is([data-subtype="fill-blanks"],[data-primitive="matching"]) :is(.ex-blank, .ex-match-drop){cursor: pointer;} :is(.pz,.modal-overlay) .exercise:not([data-editor-preview]):is([data-subtype="fill-blanks"],[data-primitive="matching"]) :is(.ex-blank, .ex-match-drop):hover{border-color: var(--accent);} :is(.pz,.modal-overlay) :is(.ex-blank, .ex-match-drop).choosing{border-style: solid; border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb,var(--accent) 24%,transparent);} html[data-mode=mobile] :is(.pz,.modal-overlay) .exercise[data-subtype="fill-blanks"] .ex-blank,html[data-mode=mobile] :is(.pz,.modal-overlay) .exercise[data-primitive="matching"] .ex-match-drop{min-height: 48px; cursor: pointer;} html[data-mode=mobile] :is(.pz,.modal-overlay) .exercise:is([data-subtype="fill-blanks"],[data-primitive="matching"]) .ex-bank .ex-item{cursor: default;} html[data-mode=mobile] :is(.pz,.modal-overlay) .exercise[data-primitive="matching"] .ex-match-drop:empty::after{content: "tap to choose";} :is(.pz,.modal-overlay) .ex-sequence{display: flex; flex-direction: column; gap: .45em; min-height: 3em;} :is(.pz,.modal-overlay) .ex-sequence .ex-item{width: 100%;} :is(.pz,.modal-overlay) .ex-sequence-inline{flex-direction: row; flex-wrap: wrap; align-items: center; align-content: flex-start;} :is(.pz,.modal-overlay) .ex-sequence-inline .ex-item{width: auto; max-width: 100%; flex: 0 1 auto; white-space: normal;} :is(.pz,.modal-overlay) .ex-pairs{display: flex; flex-direction: column; gap: .5em;} :is(.pz,.modal-overlay) .ex-pair-row{display: grid; grid-template-columns: minmax(0,1fr) minmax(8em,1fr); gap: .7em; align-items: center;} :is(.pz,.modal-overlay) .ex-pair-left{padding: .45em .2em; unicode-bidi: isolate;} :is(.pz,.modal-overlay) .ex-match-drop{margin: 0; min-width: 0;} :is(.pz,.modal-overlay) .ex-match-drop:empty::after{content: "drop or click to choose"; margin: auto; color: var(--graytx); opacity: .48; font: .7em var(--sans);} :is(.pz,.modal-overlay) .ex-segments .ex-options{gap: .15em;} :is(.pz,.modal-overlay) .ex-segments .ex-option{border-radius: 4px;} :is(.pz,.modal-overlay) .answer-correct{border-color: var(--ok) !important; background: color-mix(in srgb,var(--ok) 12%,var(--sheet-bg)) !important;} :is(.pz,.modal-overlay) .answer-correct::after{content: " ✓"; color: var(--ok); font-weight: 700;} :is(.pz,.modal-overlay) .answer-wrong{border-color: var(--danger) !important; background: color-mix(in srgb,var(--danger) 10%,var(--sheet-bg)) !important;} :is(.pz,.modal-overlay) .answer-wrong::after{content: " ✕"; color: var(--danger); font-weight: 700;} :is(.pz,.modal-overlay) .answer-missed{border-color: var(--warn) !important; border-style: dashed !important;} :is(.pz,.modal-overlay) .answer-missed::after{content: " • correct answer"; color: var(--warn); font: .7em var(--sans);} :is(.pz,.modal-overlay) .ex-image{margin: .7em 0;} :is(.pz,.modal-overlay) .ex-image img{display: block; max-width: 100%; max-height: 22em; border-radius: 8px; border: 1px solid var(--rule);} :is(.pz,.modal-overlay) .ex-image.align-center img{margin-inline: auto;} :is(.pz,.modal-overlay) .ex-image.align-right img{margin-inline: auto 0;} :is(.pz,.modal-overlay) .ex-image-placeholder{display: inline-block; font-family: ui-monospace, Menlo, monospace; font-size: .82em; color: var(--graytx); border: 1px dashed var(--rule); border-radius: 6px; padding: .2em .5em;} :is(.pz,.modal-overlay) .ex-audio{margin: .7em 0;} :is(.pz,.modal-overlay) .ex-audio audio{display: block; max-width: 100%;} :is(.pz,.modal-overlay) .ex-audio.align-center audio{margin-inline: auto;} :is(.pz,.modal-overlay) .ex-audio.align-right audio{margin-inline: auto 0;} :is(.pz,.modal-overlay) .ex-audio-placeholder{display: inline-block; font-family: ui-monospace, Menlo, monospace; font-size: .82em; color: var(--graytx); border: 1px dashed var(--rule); border-radius: 6px; padding: .2em .5em;} :is(.pz,.modal-overlay) .ex-explanation{margin-top: .85em; padding: .65em .75em; border-left: 3px solid var(--accent); background: color-mix(in srgb,var(--accent) 6%,transparent); color: var(--ink);} :is(.pz,.modal-overlay) .ex-explanation.success{border-color: var(--ok); background: color-mix(in srgb,var(--ok) 8%,transparent);} :is(.pz,.modal-overlay) .ex-explanation.error{border-color: var(--danger); background: color-mix(in srgb,var(--danger) 7%,transparent);} :is(.pz,.modal-overlay) .ex-invalid{color: var(--danger);} :is(.pz,.modal-overlay) .ex-invalid ul{margin-bottom: 0;} :is(.pz,.modal-overlay) .exercise-correction{display: flex; align-items: center; justify-content: center; gap: 1em; margin: 2.2em 0 1em; padding-top: 1.1em; border-top: 1px solid var(--rulec);} :is(.pz,.modal-overlay) .ex-score{font: 700 .95em var(--sans); color: var(--danger);} :is(.pz,.modal-overlay) .ex-score.perfect{color: var(--ok);} :is(.pz,.modal-overlay) .ex-strip{display: flex; align-items: center; gap: .75em; flex-wrap: wrap; margin: 0 0 .7em; font: .8em/1.2 var(--sans); color: var(--graytx);} :is(.pz,.modal-overlay) .ex-strip-say{font-weight: 700; color: var(--ink);} :is(.pz,.modal-overlay) .ex-dots{display: flex; gap: .35em; margin: 0; padding: 0; list-style: none;} :is(.pz,.modal-overlay) .ex-dot{min-width: 1.7em; height: 1.7em; padding: 0 .3em; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--rulec); border-radius: 99px; background: var(--sheet-bg); color: var(--graytx); font: 700 .85em/1 var(--sans); box-sizing: border-box;} :is(.pz,.modal-overlay) .ex-dot.on{border-color: var(--accent); color: var(--accent);} :is(.pz,.modal-overlay) .ex-dot.done{border-color: var(--ok); color: var(--ok); background: color-mix(in srgb, var(--ok) 9%, var(--sheet-bg));} :is(.pz,.modal-overlay) .ex-chain .ex-steps{display: flex; flex-direction: column; gap: .5em;} :is(.pz,.modal-overlay) .ex-chain .ex-step{outline: none; scroll-margin-block: 1em;} :is(.pz,.modal-overlay) .ex-chain .ex-step[hidden],:is(.pz,.modal-overlay) .ex-chain .ex-earlier[hidden],:is(.pz,.modal-overlay) .ex-chain .ex-chain-result[hidden]{display: none;} :is(.pz,.modal-overlay) .ex-step-no{margin: .2em 0 .1em; font: 700 .72em/1.2 var(--sans); letter-spacing: .07em; text-transform: uppercase; color: var(--graytx);} :is(.pz,.modal-overlay) .sheet .ex-chain .ex-step > .exercise{margin: .3em 0 .5em; background: transparent; border-color: color-mix(in srgb, var(--rulec) 70%, transparent);} :is(.pz,.modal-overlay) .ex-step-bar{display: flex; align-items: center; gap: .6em; flex-wrap: wrap; margin: 0 0 .4em;} :is(.pz,.modal-overlay) .ex-step-bar .btn{font: 700 .82em/1.2 var(--sans); cursor: pointer;} :is(.pz,.modal-overlay) .ex-step-result{font: 700 .9em/1.2 var(--sans);} :is(.pz,.modal-overlay) .ex-step-result.ok{color: var(--ok);} :is(.pz,.modal-overlay) .ex-step-result.err{color: var(--danger);} :is(.pz,.modal-overlay) .ex-step-next{margin-inline-start: auto;} :is(.pz,.modal-overlay) .ex-earlier{margin: 0 0 .2em; border: 1px dashed var(--rulec); border-radius: 8px; padding: .35em .7em;} :is(.pz,.modal-overlay) .ex-earlier > summary{cursor: pointer; font: 700 .8em/1.4 var(--sans); color: var(--graytx);} :is(.pz,.modal-overlay) .ex-earlier-body{margin-top: .5em; display: flex; flex-direction: column; gap: .4em;} :is(.pz,.modal-overlay) .ex-chain-result{margin: .8em 0 0; font: 700 1em/1.3 var(--sans);} :is(.pz,.modal-overlay) .ex-chain-result.ok{color: var(--ok);} :is(.pz,.modal-overlay) .ex-chain-result.err{color: var(--danger);} :is(.pz,.modal-overlay) .ex-showall{margin-left: auto; padding: .18em .5em; border: 1px solid var(--rulec); border-radius: 5px; background: var(--sheet-bg); color: var(--graytx); font: .72em/1.2 var(--sans); cursor: pointer;} :is(.pz,.modal-overlay) .ex-showall:hover,:is(.pz,.modal-overlay) .ex-showall[aria-pressed=true]{color: var(--accent); border-color: var(--accent);} :is(.pz,.modal-overlay) .ex-showall ~ .ex-edit{margin-left: 0;} @media print{ :is(.pz,.modal-overlay) .ex-step-bar,:is(.pz,.modal-overlay) .ex-strip{display: none;} } :is(.pz,.modal-overlay) .ex-flashcard{position: relative; width: min(100%, 34em); min-height: 12em; margin: .2em auto; display: flex; align-items: center; justify-content: center; padding: 1.2em; border: 1px solid var(--rulec); border-radius: 14px; background: var(--sheet-bg); color: var(--ink); font: inherit; cursor: pointer; text-align: center; box-shadow: 0 5px 18px color-mix(in srgb,var(--ink) 8%,transparent);} :is(.pz,.modal-overlay) .ex-flashcard:hover{border-color: var(--accentlt);} body.ex-hide-transliteration :is(.pz,.modal-overlay) .ex-card-transliteration{display: none !important;} :is(.pz,.modal-overlay) .ex-flashcard:focus-visible{outline: 2px solid var(--accent); outline-offset: 3px;} :is(.pz,.modal-overlay) .ex-flashcard :is(audio, video, iframe, input, select, textarea){cursor: auto;} :is(.pz,.modal-overlay) .ex-card-front,:is(.pz,.modal-overlay) .ex-card-back{display: flex; flex-direction: column; gap: .35em; align-items: center;} :is(.pz,.modal-overlay) .ex-flashcard:has(.ex-card-blocks){flex-wrap: wrap; gap: .6em 2em;} :is(.pz,.modal-overlay) .ex-flashcard:has(.ex-card-blocks) > :is(.ex-card-front, .ex-card-back){min-width: 0; max-width: 100%;} :is(.pz,.modal-overlay) .ex-card-field{unicode-bidi: isolate;} :is(.pz,.modal-overlay) .ex-card-field.primary{font-weight: 700;} :is(.pz,.modal-overlay) .ex-card-front:has(> .ex-card-blocks),:is(.pz,.modal-overlay) .ex-card-back:has(> .ex-card-blocks){flex: 1 1 16em; align-self: stretch; justify-content: center;} :is(.pz,.modal-overlay) .ex-card-field.ex-card-blocks{align-self: stretch; min-width: 0; max-width: 100%; overflow-x: auto; text-align: start; font-weight: 400;} :is(.pz,.modal-overlay) .ex-card-blocks.primary[style*="font-size:120%;"],:is(.pz,.modal-overlay) .ex-card-blocks.secondary[style*="font-size:88%;"]{font-size: 100% !important;} :is(.pz,.modal-overlay) .ex-card-field > :is(p, .fa-par, .fa-display, .la-par):only-child{margin: 0;} :is(.pz,.modal-overlay) .ex-card-field:not(.ex-card-blocks) :is(.fa-par, .fa-display){font-size: inherit; line-height: inherit; text-align: inherit;} :is(.pz,.modal-overlay) .ex-card-field:not(.ex-card-blocks) .fa-display{padding-left: 0;} :is(.pz,.modal-overlay) .ex-card-field:not(.ex-card-blocks) .fa-display .fa{font-size: inherit;} :is(.pz,.modal-overlay) .ex-card-blocks > :first-child{margin-top: 0;} :is(.pz,.modal-overlay) .ex-card-blocks > :last-child{margin-bottom: 0;} :is(.pz,.modal-overlay) .ex-flashcard figure.img{max-width: 100%; margin-top: .5em; margin-bottom: .5em;} body[data-page="doc"] :is(.pz,.modal-overlay) .ex-flashcard figure.img:hover img,body[data-page="edit"] :is(.pz,.modal-overlay) .ex-flashcard figure.img:hover img{outline: none;} :is(.pz,.modal-overlay) .ex-card-image{max-width: min(100%,18em); max-height: 8em; object-fit: contain; border-radius: 8px;} :is(.pz,.modal-overlay) .ex-card-image-placeholder,:is(.pz,.modal-overlay) .ex-card-audio-placeholder{color: var(--graytx); font: .72em var(--sans);} :is(.pz,.modal-overlay) .ex-card-audio{display: inline-flex; align-items: center;} :is(.pz,.modal-overlay) .ex-card-play{display: inline-flex; align-items: center; justify-content: center; min-width: 2.2em; min-height: 2.2em; padding: .25em .5em; border: 1px solid var(--rulec); border-radius: 999px; background: var(--sheet-bg); color: var(--ink); font: 1em/1 var(--sans); cursor: pointer; touch-action: manipulation;} :is(.pz,.modal-overlay) .ex-card-play:hover{border-color: var(--accentlt);} :is(.pz,.modal-overlay) .ex-card-play:focus-visible{outline: 2px solid var(--accent); outline-offset: 2px;} :is(.pz,.modal-overlay) .ex-card-play.playing{border-color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, var(--sheet-bg)); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 22%, transparent);} :is(.pz,.modal-overlay) .ex-flashcard > small{position: absolute; inset-inline-end: .7em; bottom: .55em; color: var(--graytx); font: .65em var(--sans);} :is(.pz,.modal-overlay) .ex-head:has(> .ex-card-note){flex-wrap: wrap; justify-content: flex-end; row-gap: .25em; container: ex-head / inline-size;} :is(.pz,.modal-overlay) .ex-head:has(> .ex-card-note) > .ex-kicker{margin-right: auto;} :is(.pz,.modal-overlay) .ex-card-note{flex: 1 1 0%; min-width: 8em; color: var(--graytx); font: .72em/1.3 var(--sans);} :is(.pz,.modal-overlay) .ex-card-note ~ *{flex-shrink: 0;} @container ex-head (max-width: 23em){ :is(.pz,.modal-overlay) .ex-card-note{order: 1; flex: 0 0 100%; min-width: 0;} } @container ex-head (max-width: 31em){ :is(.pz,.modal-overlay) .ex-head:has(> .ex-translit-switch) > .ex-card-note{order: 1; flex: 0 0 100%; min-width: 0;} } .modal-overlay.ex-zoom-overlay{z-index: 110; padding: 2vh 2vw;} :is(.pz,.modal-overlay) .modal.ex-zoom-modal{width: 96vw; height: 94vh; max-height: none; padding: .7rem .9rem 1rem; gap: .6rem;} :is(.pz,.modal-overlay) .ex-zoom-modal:focus{outline: none;} :is(.pz,.modal-overlay) .ex-zoom-head{display: flex; align-items: center; gap: .8rem;} :is(.pz,.modal-overlay) .ex-zoom-hint{margin-left: auto; color: var(--chrome-mut); font-size: .78rem;} :is(.pz,.modal-overlay) .sheet.ex-zoom-stage{flex: 1 1 auto; min-height: 0; display: flex; max-width: none; width: 100%; margin: 0; padding: .35rem; background: transparent; box-shadow: none; border-radius: 0; overflow: auto; scrollbar-gutter: stable both-edges;} :is(.pz,.modal-overlay) .ex-zoom-card{flex: none; margin: auto; position: relative;} :is(.pz,.modal-overlay) .ex-zoom-scale{position: absolute; left: 0; top: 0; transform-origin: 0 0;} :is(.pz,.modal-overlay) .ex-zoom-scale > .ex-flashcard{margin: 0;} :is(.pz,.modal-overlay) .ex-zoom-stage .fncloud{display: none; font-size: calc(.82em / var(--zoom, 1)); max-width: min(30em, calc(82vw / var(--zoom, 1))); transform: translateX(calc(-50% + var(--fn-shift, 0px)));} :is(.pz,.modal-overlay) .ex-zoom-stage .fn:hover .fncloud,:is(.pz,.modal-overlay) .ex-zoom-stage .fnref:focus + .fncloud{display: block;} :is(.pz,.modal-overlay) .ex-zoom-stage .fncloud::after{border-width: calc(6px / var(--zoom, 1)); margin-left: calc(-6px / var(--zoom, 1) - var(--fn-shift, 0px));} @media (max-width: 620px){ .modal-overlay.ex-zoom-overlay{padding: 0;} :is(.pz,.modal-overlay) .modal.ex-zoom-modal{width: 100vw; height: 100%; border-radius: 0; padding: .5rem .4rem .4rem;} :is(.pz,.modal-overlay) .sheet.ex-zoom-stage{padding: .15rem;} } :is(.pz,.modal-overlay) .header-modal{width: min(560px, 94vw);} :is(.pz,.modal-overlay) .header-preview{margin: 0; padding: .55rem .7rem; border: 1px dashed var(--chrome-line); border-radius: 8px; background: var(--chrome-bg); color: var(--chrome-mut); font: 12px/1.5 ui-monospace, Menlo, monospace; white-space: pre-wrap; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .ex-picker{width: min(760px, 96vw);} :is(.pz,.modal-overlay) .ex-type-grid{display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .45rem; overflow-y: auto;} :is(.pz,.modal-overlay) .ex-type{text-align: left; padding: .65rem .75rem; border-radius: 8px; cursor: pointer; border: 1px solid var(--chrome-line); color: var(--chrome-fg); background: var(--chrome-bg);} :is(.pz,.modal-overlay) .ex-type strong,:is(.pz,.modal-overlay) .ex-type small{display: block;} :is(.pz,.modal-overlay) .ex-type small{margin-top: .2rem; color: var(--chrome-mut); line-height: 1.35;} :is(.pz,.modal-overlay) .ex-type:hover{color: var(--accent); border-color: var(--accent);} :is(.pz,.modal-overlay) .ex-form-modal{width: min(860px, 96vw); padding: 0; gap: 0; overflow: hidden;} :is(.pz,.modal-overlay) .ex-form-head{display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding: 1rem 1.2rem .85rem; border-bottom: 1px solid var(--chrome-line);} :is(.pz,.modal-overlay) .ex-form-head > div{min-width: 0;} :is(.pz,.modal-overlay) .ex-form-head p{margin-top: .25rem;} :is(.pz,.modal-overlay) .ex-form-body{min-height: 0; overflow-y: auto; padding: .9rem 1.2rem 1.2rem;} :is(.pz,.modal-overlay) .ex-form-section{display: flex; flex-direction: column; gap: .65rem; padding: .85rem 0; border-bottom: 1px solid var(--chrome-line);} :is(.pz,.modal-overlay) .ex-form-section:first-child{padding-top: 0;} :is(.pz,.modal-overlay) .ex-form-section:last-child{border-bottom: 0; padding-bottom: 0;} :is(.pz,.modal-overlay) .ex-form-section h4:not(:where(.sheet h4)){margin: 0; color: var(--accent); font-size: .9rem;} :is(.pz,.modal-overlay) .ex-form-actions{padding: .8rem 1.2rem; border-top: 1px solid var(--chrome-line); background: var(--chrome-bg);} :is(.pz,.modal-overlay) .ex-author-field{display: flex; flex-direction: column; gap: .25rem; min-width: 0; color: var(--chrome-mut); font-size: .8rem;} :is(.pz,.modal-overlay) .ex-author-field > span{font-weight: 650; color: var(--chrome-fg);} :is(.pz,.modal-overlay) .ex-author-field.ex-dir-field{display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: .25rem .5rem;} :is(.pz,.modal-overlay) .ex-author-field.ex-dir-field > span{grid-column: 1;} :is(.pz,.modal-overlay) .ex-author-field.ex-dir-field > .ex-text-direction{grid-column: 2; grid-row: 1;} :is(.pz,.modal-overlay) .ex-author-field.ex-dir-field > :not(span):not(.ex-text-direction){grid-column: 1 / -1;} :is(.pz,.modal-overlay) .ex-text-direction{justify-self: end; width: auto; padding: .18rem .45rem; border: 1px solid var(--chrome-line); border-radius: 5px; background: var(--chrome-bg); color: var(--chrome-mut); font: 700 .73rem/1.2 var(--sans); cursor: pointer;} :is(.pz,.modal-overlay) .ex-text-direction:hover,:is(.pz,.modal-overlay) .ex-text-direction:focus-visible{color: var(--accent); border-color: var(--accent);} :is(.pz,.modal-overlay) .ex-picker > .ex-text-direction{align-self: flex-end;} :is(.pz,.modal-overlay) .modal.ex-form-modal .ex-author-field textarea,:is(.pz,.modal-overlay) .modal.ex-form-modal .ex-author-field input,:is(.pz,.modal-overlay) .modal.ex-form-modal .ex-author-field select{width: 100%; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg); color: var(--chrome-fg); padding: .48rem .6rem; font: .9rem/1.42 var(--sans); resize: vertical;} :is(.pz,.modal-overlay) .modal.ex-form-modal .ex-author-field textarea{min-height: 4.3rem; font: .9rem/1.42 var(--sans); padding: .48rem .6rem;} :is(.pz,.modal-overlay) .ex-author-field small{line-height: 1.35;} :is(.pz,.modal-overlay) .modal.ex-form-modal .ex-author-field textarea.ex-jolly-text{min-height: 6.4rem; font: .84rem/1.5 ui-monospace, "SF Mono", Menlo, monospace; tab-size: 2;} :is(.pz,.modal-overlay) .modal.ex-form-modal .ex-author-field :is(textarea, input[type="text"]):dir(rtl),:is(.pz,.modal-overlay) .ex-picker textarea.ex-paste:dir(rtl){font-family: var(--fa-font); text-align: right; line-height: 1.65;} :is(.pz,.modal-overlay) .ex-insert-row{display: flex; flex-wrap: wrap; gap: .35rem;} :is(.pz,.modal-overlay) .ex-audio-play{min-width: 2.2rem;} :is(.pz,.modal-overlay) .ex-audio-play.playing{color: var(--accent); border-color: var(--accent);} :is(.pz,.modal-overlay) .ex-upload-row{display: flex; align-items: center; gap: .4rem; min-width: 0;} :is(.pz,.modal-overlay) .modal.ex-form-modal .ex-upload-row input{flex: 1 1 auto; min-width: 0;} :is(.pz,.modal-overlay) .ex-upload-row .btn{flex: none;} :is(.pz,.modal-overlay) .ex-form-list{display: flex; flex-direction: column; gap: .6rem;} :is(.pz,.modal-overlay) .ex-form-row{padding: .7rem; border: 1px solid var(--chrome-line); border-radius: 9px; background: var(--chrome-bg);} :is(.pz,.modal-overlay) .ex-form-row.compact{display: grid; grid-template-columns: 1fr auto; align-items: end; gap: .5rem;} :is(.pz,.modal-overlay) .ex-row-head{display: flex; align-items: center; gap: .3rem; margin-bottom: .45rem;} :is(.pz,.modal-overlay) .ex-row-head strong,:is(.pz,.modal-overlay) .ex-correct-toggle{margin-right: auto; color: var(--chrome-fg); font-size: .8rem;} :is(.pz,.modal-overlay) .ex-correct-toggle{cursor: pointer;} :is(.pz,.modal-overlay) .ex-field-cols{display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .65rem;} :is(.pz,.modal-overlay) .ex-add-row{justify-content: flex-start; margin: 0;} :is(.pz,.modal-overlay) .ex-field-style{margin-top: .15rem;} :is(.pz,.modal-overlay) .ex-field-style summary{cursor: pointer; color: var(--accent); font-size: .76rem;} :is(.pz,.modal-overlay) .ex-field-style .ex-field-cols{margin-top: .5rem;} :is(.pz,.modal-overlay) .modal.ex-form-modal .ex-field-style .ex-side-toggle{display: flex; align-items: center; gap: .4rem; margin-top: .6rem;} :is(.pz,.modal-overlay) .modal.ex-form-modal .ex-field-style .ex-side-toggle input{width: auto; padding: 0; margin: 0;} :is(.pz,.modal-overlay) .ex-form-preview-status{min-height: 1.15em;} :is(.pz,.modal-overlay) .sheet.ex-form-preview{width: 100%; max-width: none; margin: 0; padding: .75rem; border: 1px solid var(--chrome-line); border-radius: 9px; box-shadow: none; background: var(--sheet-bg); color: var(--ink);} :is(.pz,.modal-overlay) .sheet.ex-form-preview .exercise{margin: 0;} :is(.pz,.modal-overlay) .sheet.ex-form-preview .ex-edit,:is(.pz,.modal-overlay) .sheet.ex-form-preview .ex-to-deck{display: none;} :is(.pz,.modal-overlay) .ex-steps-hint{margin: 0; color: var(--chrome-mut); font-size: .8rem;} :is(.pz,.modal-overlay) .ex-steps-hint.short{color: var(--danger, #b3261e);} :is(.pz,.modal-overlay) .ex-steps-tools{display: flex; flex-wrap: wrap; align-items: center; gap: .3rem;} :is(.pz,.modal-overlay) .ex-steps-picked{margin-inline: .3rem auto; color: var(--chrome-mut); font-size: .78rem;} :is(.pz,.modal-overlay) .ex-steps-list{display: flex; flex-direction: column; gap: .4rem; margin: 0; padding: 0; list-style: none;} :is(.pz,.modal-overlay) .ex-step-row{position: relative; display: grid; align-items: center; gap: .35rem .5rem; grid-template-columns: auto auto 3.4rem minmax(0, 1fr); padding: .5rem .6rem; border: 1px solid var(--chrome-line); border-radius: 9px; background: var(--chrome-bg);} :is(.pz,.modal-overlay) .ex-step-row.picked{border-color: var(--accent);} :is(.pz,.modal-overlay) .ex-step-row.bad{border-color: var(--danger, #b3261e);} :is(.pz,.modal-overlay) .ex-step-row.dragging{opacity: .55;} :is(.pz,.modal-overlay) .ex-step-row.drop-before::before,:is(.pz,.modal-overlay) .ex-step-row.drop-after::after{content: ""; position: absolute; inset-inline: 0; height: 3px; border-radius: 2px; background: var(--accent);} :is(.pz,.modal-overlay) .ex-step-row.drop-before::before{top: -3px;} :is(.pz,.modal-overlay) .ex-step-row.drop-after::after{bottom: -3px;} :is(.pz,.modal-overlay) .ex-step-pick{width: 1.15rem; height: 1.15rem; margin: 0;} :is(.pz,.modal-overlay) .ex-step-grip{width: 2rem; min-height: 2.2rem; padding: 0; border: 0; border-radius: 6px; background: transparent; color: var(--chrome-mut); font: 700 1rem/1 var(--sans); letter-spacing: -.2em; cursor: grab; touch-action: none;} :is(.pz,.modal-overlay) .ex-step-grip:hover,:is(.pz,.modal-overlay) .ex-step-grip:focus-visible{color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, transparent);} :is(.pz,.modal-overlay) .ex-step-row.dragging .ex-step-grip{cursor: grabbing;} :is(.pz,.modal-overlay) .modal.ex-form-modal .ex-step-no{width: 3.4rem; padding: .3rem .25rem; text-align: center; border: 1px solid var(--chrome-line); border-radius: 7px; background: var(--chrome-bg); color: var(--chrome-fg); font: 700 .9rem/1.2 var(--sans);} :is(.pz,.modal-overlay) .ex-step-main{min-width: 0;} :is(.pz,.modal-overlay) .ex-step-of{display: flex; flex-wrap: wrap; align-items: baseline; gap: .1rem .45rem; color: var(--chrome-mut); font-size: .74rem;} :is(.pz,.modal-overlay) .ex-step-kind{color: var(--accent); font-weight: 650;} :is(.pz,.modal-overlay) .ex-step-kind::before{content: "· "; color: var(--chrome-mut); font-weight: 400;} :is(.pz,.modal-overlay) .ex-step-mark{font-size: .8rem;} :is(.pz,.modal-overlay) .ex-step-words{margin-top: .1rem; color: var(--chrome-fg); font-size: .9rem; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .ex-step-err{margin-top: .2rem; color: var(--danger, #b3261e); font-size: .78rem;} :is(.pz,.modal-overlay) .ex-step-from{margin-top: .2rem; color: var(--chrome-mut); font-size: .74rem;} :is(.pz,.modal-overlay) .ex-step-actions{grid-column: 4; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: .2rem;} :is(.pz,.modal-overlay) .ex-step-more{display: contents;} :is(.pz,.modal-overlay) .ex-step-actions .ex-step-more > .ex-step-delete{color: var(--danger, #b3261e);} :is(.pz,.modal-overlay) .ex-step-actions .ex-step-toggle{display: none;} :is(.pz,.modal-overlay) .ex-steps-undo{display: flex; align-items: center; gap: .5rem; padding: .4rem .6rem; border-radius: 8px; border: 1px dashed var(--chrome-line); color: var(--chrome-fg); font-size: .82rem;} :is(.pz,.modal-overlay) .ex-steps-undo[hidden]{display: none;} :is(.pz,.modal-overlay) .ex-steps-originals{display: flex; align-items: flex-start; gap: .45rem; color: var(--chrome-fg); font-size: .84rem;} :is(.pz,.modal-overlay) .ex-steps-originals[hidden]{display: none;} :is(.pz,.modal-overlay) .ex-steps-live{position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%);} html[data-mode=mobile] :is(.pz,.modal-overlay) .ex-step-row{grid-template-columns: auto auto 3.2rem minmax(0, 1fr); min-height: 48px;} html[data-mode=mobile] :is(.pz,.modal-overlay) .ex-step-actions{grid-column: 1 / -1;} html[data-mode=mobile] :is(.pz,.modal-overlay) .ex-step-actions .btn{min-height: 44px; min-width: 44px;} html[data-mode=mobile] :is(.pz,.modal-overlay) .ex-step-actions .ex-step-toggle{display: inline-flex; align-items: center; justify-content: center;} html[data-mode=mobile] :is(.pz,.modal-overlay) .ex-step-more{display: none;} html[data-mode=mobile] :is(.pz,.modal-overlay) .ex-step-row.more-open .ex-step-more{display: flex; flex-wrap: wrap; gap: .2rem; flex-basis: 100%;} .modal-overlay.ex-step-frame .ex-form-modal{box-shadow: 0 12px 40px rgba(0,0,0,.35);} :is(.pz,.modal-overlay) .ex-from-page{width: min(680px, 96vw); max-height: 90vh; display: flex; flex-direction: column; gap: .6rem;} :is(.pz,.modal-overlay) .ex-from-lead{margin: 0; color: var(--chrome-mut); font-size: .84rem;} :is(.pz,.modal-overlay) .ex-from-tools{display: flex; flex-wrap: wrap; align-items: center; gap: .35rem;} :is(.pz,.modal-overlay) .ex-from-filter{flex: 1 1 10rem; min-width: 0; padding: .4rem .55rem; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg); color: var(--chrome-fg); font: .88rem var(--sans);} :is(.pz,.modal-overlay) .ex-from-count{margin-inline-start: auto; color: var(--chrome-mut); font-size: .78rem;} :is(.pz,.modal-overlay) .ex-from-list{display: flex; flex-direction: column; gap: .3rem; min-height: 4rem; overflow-y: auto; padding: .4rem; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg);} :is(.pz,.modal-overlay) .ex-from-item{display: grid; grid-template-columns: auto minmax(0, 11rem) minmax(0, 1fr); align-items: baseline; gap: .1rem .6rem; padding: .4rem .45rem; border-radius: 7px; cursor: pointer;} :is(.pz,.modal-overlay) .ex-from-item:hover{background: color-mix(in srgb, var(--accent) 8%, transparent);} :is(.pz,.modal-overlay) .ex-from-item[hidden]{display: none;} :is(.pz,.modal-overlay) .ex-from-item.off{cursor: default; opacity: .6;} :is(.pz,.modal-overlay) .ex-from-item input{margin: 0; align-self: center;} :is(.pz,.modal-overlay) .ex-from-kind{color: var(--accent); font-size: .76rem; font-weight: 650;} :is(.pz,.modal-overlay) .ex-from-words{color: var(--chrome-fg); font-size: .88rem; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .ex-from-note{grid-column: 2 / -1; color: var(--chrome-mut); font-size: .74rem;} :is(.pz,.modal-overlay) .ex-from-order{display: flex; flex-wrap: wrap; gap: .3rem 1rem; margin: 0; padding: 0; border: 0; font-size: .84rem;} :is(.pz,.modal-overlay) .ex-from-order legend{padding: 0; margin-bottom: .2rem; color: var(--chrome-fg); font-weight: 650; font-size: .8rem;} :is(.pz,.modal-overlay) .ex-from-remove{display: flex; align-items: flex-start; gap: .45rem; font-size: .84rem;} :is(.pz,.modal-overlay) .ex-from-remove[hidden]{display: none;} :is(.pz,.modal-overlay) .ex-prompt-modal{width: min(650px, 96vw);} :is(.pz,.modal-overlay) .ex-decks{display: flex; flex-direction: column; gap: .35rem; max-height: 42vh; overflow-y: auto; padding: .5rem; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg);} :is(.pz,.modal-overlay) .ex-deck{display: flex; align-items: center; gap: .55rem; padding: .28rem; cursor: pointer;} :is(.pz,.modal-overlay) .ex-deck:hover{color: var(--accent);} :is(.pz,.modal-overlay) .ex-copy-status{margin-right: auto;} @media (max-width: 620px){ :is(.pz,.modal-overlay) .ex-step-row{grid-template-columns: auto auto 3.2rem minmax(0, 1fr); min-height: 48px;} :is(.pz,.modal-overlay) .ex-step-actions{grid-column: 1 / -1;} :is(.pz,.modal-overlay) .ex-step-actions .btn{min-height: 44px; min-width: 44px;} :is(.pz,.modal-overlay) .ex-step-actions .ex-step-toggle{display: inline-flex; align-items: center; justify-content: center;} :is(.pz,.modal-overlay) .ex-step-more{display: none;} :is(.pz,.modal-overlay) .ex-step-row.more-open .ex-step-more{display: flex; flex-wrap: wrap; gap: .2rem; flex-basis: 100%;} :is(.pz,.modal-overlay) .ex-step-pick{width: 1.4rem; height: 1.4rem;} :is(.pz,.modal-overlay) .ex-from-item{grid-template-columns: auto minmax(0, 1fr);} :is(.pz,.modal-overlay) .ex-from-kind{grid-column: 2;} :is(.pz,.modal-overlay) .ex-from-words{grid-column: 2;} :is(.pz,.modal-overlay) .ex-pair-row{grid-template-columns: 1fr; gap: .2em;} :is(.pz,.modal-overlay) .ex-type-grid{grid-template-columns: 1fr;} :is(.pz,.modal-overlay) .ex-field-cols{grid-template-columns: 1fr;} :is(.pz,.modal-overlay) .ex-form-head,:is(.pz,.modal-overlay) .ex-form-body,:is(.pz,.modal-overlay) .ex-form-actions{padding-inline: .8rem;} :is(.pz,.modal-overlay) .ex-form-row.compact{grid-template-columns: 1fr;} :is(.pz,.modal-overlay) .sheet .exercise{padding: .8em;} } :is(.pz,.modal-overlay){--fac-crimson: #8E2B34; --fac-indigo: #2F3E8F; --fac-teal: #13605C; --fac-violet: #5C2E7E; --fac-amber: #8A5A0B; --fac-ungram: #C9463C;} html[data-sheet="dark"] :is(.pz,.modal-overlay){--fac-crimson: #E4808A; --fac-indigo: #93A6EE; --fac-teal: #5FC0B8; --fac-violet: #C193E4; --fac-amber: #DDA653; --fac-ungram: #F0928A;} :is(.pz,.modal-overlay) .ungram-run{color: var(--fac-ungram);} :is(.pz,.modal-overlay) .ungram-run .fa{cursor: default;} :is(.pz,.modal-overlay) .ungram-run .fa:hover{background: none;} :is(.pz,.modal-overlay) .ungram-x{font-size: .8em; margin-right: .12em;} :is(.pz,.modal-overlay) .fac-crimson{color: var(--fac-crimson);} :is(.pz,.modal-overlay) .fac-indigo{color: var(--fac-indigo);} :is(.pz,.modal-overlay) .fac-teal{color: var(--fac-teal);} :is(.pz,.modal-overlay) .fac-violet{color: var(--fac-violet);} :is(.pz,.modal-overlay) .fac-amber{color: var(--fac-amber);} :is(.pz,.modal-overlay) .segmented-colour-run .seg-colour{display: inline; font-family: inherit; font-size: inherit; font-weight: inherit; font-style: inherit; font-stretch: inherit; font-variant: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; line-height: inherit; letter-spacing: inherit; writing-mode: inherit; direction: inherit; unicode-bidi: normal; margin: 0; padding: 0;} :is(.pz,.modal-overlay) .fapal{position: absolute; z-index: 70; display: flex; align-items: center; gap: .3rem; padding: .3rem .4rem; background: var(--chrome-panel); border: 1px solid var(--chrome-line); border-radius: 99px; box-shadow: 0 6px 24px rgba(0,0,0,.24);} :is(.pz,.modal-overlay) .fapal button{width: 1.15rem; height: 1.15rem; border-radius: 50%; cursor: pointer; border: 2px solid transparent; padding: 0; font-size: .7rem; display: inline-flex; align-items: center; justify-content: center;} :is(.pz,.modal-overlay) .fapal button:hover{transform: scale(1.18);} :is(.pz,.modal-overlay) .fapal button.on{border-color: var(--chrome-fg);} :is(.pz,.modal-overlay) .fapal .tr-edit{display: inline-flex; align-items: center;} :is(.pz,.modal-overlay) .fapal .tr-val,:is(.pz,.modal-overlay) .fapal .tr-add{width: auto; height: auto; border-radius: 6px; padding: .1rem .35rem; font-size: .72rem; font-style: italic; line-height: 1.3; background: var(--chrome-bg); color: var(--accent); border: 1px solid var(--chrome-line); white-space: nowrap;} :is(.pz,.modal-overlay) .fapal .tr-add{font-style: normal; font-weight: 700; padding: .1rem .4rem;} :is(.pz,.modal-overlay) .fapal .tr-val:hover,:is(.pz,.modal-overlay) .fapal .tr-add:hover{transform: none; border-color: var(--accentlt); background: var(--chrome-panel);} :is(.pz,.modal-overlay) .fapal .tr-val:disabled{color: var(--chrome-mut); border-color: transparent; background: none; cursor: default;} :is(.pz,.modal-overlay) .fapal .tr-val:disabled:hover{border-color: transparent; background: none;} :is(.pz,.modal-overlay) .fapal .tr-in{width: 8.5rem; padding: .1rem .35rem; border-radius: 6px; border: 1px solid var(--accentlt); background: var(--chrome-bg); color: var(--chrome-fg); font-size: .72rem; font-style: italic;} :is(.pz,.modal-overlay) .fapal .tr-in:focus{outline: none; border-color: var(--accent);} :is(.pz,.modal-overlay) .fapal .kana-edit .tr-val,:is(.pz,.modal-overlay) .fapal .kana-edit .tr-in{font-style: normal; font-family: var(--fa-font); font-size: .8rem;} :is(.pz,.modal-overlay) .fapal .kana-edit .tr-in{width: 7rem;} :is(.pz,.modal-overlay) figure.img{margin: 1.2em 0; max-width: 125%;} :is(.pz,.modal-overlay) figure.img img{display: block; width: 100%; height: auto; border-radius: 2px;} body[data-page="doc"] :is(.pz,.modal-overlay) figure.img,body[data-page="edit"] :is(.pz,.modal-overlay) figure.img{cursor: pointer;} body[data-page="doc"] :is(.pz,.modal-overlay) figure.img:hover img,body[data-page="edit"] :is(.pz,.modal-overlay) figure.img:hover img{outline: 2px solid color-mix(in srgb, var(--accentlt) 55%, transparent); outline-offset: 2px;} :is(.pz,.modal-overlay) figure.img.img-editing img{outline: 2px solid var(--accent); outline-offset: 2px;} :is(.pz,.modal-overlay) figure.img figcaption{font-size: .78em; color: var(--graytx); margin-top: .45em; line-height: 1.45;} :is(.pz,.modal-overlay) .img-placeholder,:is(.pz,.modal-overlay) .img-missing{border: 1px dashed var(--rulec); border-radius: 6px; padding: 1.2em; text-align: center; color: var(--graytx); font-size: .85em;} :is(.pz,.modal-overlay) .img-missing{color: var(--danger);} :is(.pz,.modal-overlay) figure.video{position: relative;} :is(.pz,.modal-overlay) .video-box{aspect-ratio: 16 / 9; width: 100%; background: #171214; border-radius: 4px; overflow: hidden;} :is(.pz,.modal-overlay) .video-box iframe{width: 100%; height: 100%; border: 0; display: block;} :is(.pz,.modal-overlay) .video-edit{position: absolute; top: .45rem; right: .45rem; z-index: 5; border: 0; border-radius: 6px; cursor: pointer; background: rgba(23,18,20,.72); color: #fff; font-size: .68rem; padding: .22rem .5rem; opacity: 0; transition: opacity .12s;} :is(.pz,.modal-overlay) figure.video:hover .video-edit{opacity: 1;} :is(.pz,.modal-overlay) .video-edit:hover{background: var(--accent); color: var(--accent-fg);} body[data-page="doc"] :is(.pz,.modal-overlay) figure.video,body[data-page="edit"] :is(.pz,.modal-overlay) figure.video{cursor: default;} body[data-page="doc"] :is(.pz,.modal-overlay) figure.video:hover img,body[data-page="edit"] :is(.pz,.modal-overlay) figure.video:hover img{outline: none;} :is(.pz,.modal-overlay) figure.audio{position: relative;} :is(.pz,.modal-overlay) figure.audio audio{display: block; width: 100%; min-width: 0; max-width: 100%;} :is(.pz,.modal-overlay) .audio-edit{position: absolute; top: 100%; right: 0; z-index: 5; margin-top: -.15rem; border: 0; border-radius: 6px; cursor: pointer; background: rgba(23,18,20,.72); color: #fff; font-size: .68rem; padding: .22rem .5rem; opacity: 0; transition: opacity .12s;} :is(.pz,.modal-overlay) figure.audio:hover .audio-edit,:is(.pz,.modal-overlay) figure.audio.img-editing .audio-edit,:is(.pz,.modal-overlay) .audio-edit:focus-visible{opacity: 1;} :is(.pz,.modal-overlay) .audio-edit:hover{background: var(--accent); color: var(--accent-fg);} body[data-page="doc"] :is(.pz,.modal-overlay) figure.audio,body[data-page="edit"] :is(.pz,.modal-overlay) figure.audio{cursor: default;} body[data-page="doc"] :is(.pz,.modal-overlay) figure.audio figcaption,body[data-page="edit"] :is(.pz,.modal-overlay) figure.audio figcaption{cursor: pointer;} :is(.pz,.modal-overlay) figure.audio.img-editing audio{outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 999px;} @media (max-width: 620px){ :is(.pz,.modal-overlay) figure.audio{min-width: min(100%, 18rem);} :is(.pz,.modal-overlay) figure.audio[data-align="left"]{margin-left: 0 !important;} :is(.pz,.modal-overlay) figure.audio[data-align="center"]{margin-left: auto !important; margin-right: auto;} :is(.pz,.modal-overlay) figure.audio[data-align="right"]{margin-left: auto !important; margin-right: 0;} } @media (hover: none){ body[data-page="edit"] :is(.pz,.modal-overlay) .video-edit,body[data-page="edit"] :is(.pz,.modal-overlay) .audio-edit{opacity: 1;} } :is(.pz,.modal-overlay) .imgpanel .times{display: flex; gap: .4rem; align-items: center;} :is(.pz,.modal-overlay) .imgpanel .times input{width: 4.2rem; padding: .18rem .35rem; border-radius: 5px; border: 1px solid var(--chrome-line); background: var(--chrome-bg); color: var(--chrome-fg); font-size: .74rem; text-align: center;} :is(.pz,.modal-overlay) .imgpanel{position: absolute; z-index: 75; width: 250px; background: var(--chrome-panel); border: 1px solid var(--chrome-line); border-radius: 10px; box-shadow: 0 10px 34px rgba(0,0,0,.26); padding: .65rem .8rem; font-size: .78rem; color: var(--chrome-fg);} :is(.pz,.modal-overlay) .imgpanel .row2{display: flex; align-items: center; gap: .5rem; margin: .35rem 0;} :is(.pz,.modal-overlay) .imgpanel label{color: var(--chrome-mut); width: 3.2rem; flex: none;} :is(.pz,.modal-overlay) .imgpanel output{width: 3rem; text-align: right; font-variant-numeric: tabular-nums;} :is(.pz,.modal-overlay) .imgpanel input[type="range"]{flex: 1;} :is(.pz,.modal-overlay) .imgpanel .aligns{display: flex; gap: .25rem; flex: 1;} :is(.pz,.modal-overlay) .imgpanel .aligns button{flex: 1; padding: .25rem 0; border: 1px solid var(--chrome-line); background: var(--chrome-bg); color: var(--chrome-fg); border-radius: 6px; cursor: pointer; font-size: .78rem;} :is(.pz,.modal-overlay) .imgpanel .aligns button.on{background: var(--accent); border-color: var(--accent); color: var(--accent-fg);} :is(.pz,.modal-overlay) .imgpanel .panel-head{display: flex; justify-content: space-between; align-items: center; margin-bottom: .3rem; font-weight: 600;} :is(.pz,.modal-overlay) .imgpanel .panel-head button{border: 0; background: none; cursor: pointer; color: var(--chrome-mut); font-size: .9rem; padding: .1rem .3rem; border-radius: 4px;} :is(.pz,.modal-overlay) .imgpanel .panel-head button:hover{color: var(--danger);} :is(.pz,.modal-overlay) .imgpanel .hint2{color: var(--chrome-mut); font-size: .7rem; margin-top: .3rem;} :is(.pz,.modal-overlay) .imggrid{display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: .6rem; max-height: 46vh; overflow-y: auto; padding: .2rem;} :is(.pz,.modal-overlay) .imggrid .imgcell{position: relative; border: 1px solid var(--chrome-line); border-radius: 8px; overflow: hidden; cursor: pointer; background: var(--chrome-bg);} :is(.pz,.modal-overlay) .imggrid .imgcell img{display: block; width: 100%; height: 84px; object-fit: cover;} :is(.pz,.modal-overlay) .imggrid .imgcell .nm{font-size: .68rem; padding: .2rem .35rem; color: var(--chrome-mut); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} :is(.pz,.modal-overlay) .imggrid .imgcell:hover{border-color: var(--accentlt);} :is(.pz,.modal-overlay) .imggrid .imgcell .del{position: absolute; top: .25rem; right: .25rem; border: 0; border-radius: 4px; background: rgba(23,18,20,.55); color: #fff; cursor: pointer; font-size: .7rem; padding: .1rem .3rem; opacity: 0;} :is(.pz,.modal-overlay) .imggrid .imgcell:hover .del{opacity: 1;} :is(.pz,.modal-overlay) .imggrid .imgcell .del:hover{background: var(--danger); color: var(--danger-fg);} :is(.pz,.modal-overlay) .imggrid .imgcell .ref{position: absolute; top: .25rem; left: .25rem; font-size: .62rem; background: rgba(23,18,20,.55); color: #fff; border-radius: 4px; padding: .05rem .3rem;} :is(.pz,.modal-overlay) .editor-pane.dragover{outline: 2px dashed var(--accentlt); outline-offset: -6px;} :is(.pz,.modal-overlay) .audio-modal{width: min(620px, 96vw);} :is(.pz,.modal-overlay) .audio-modal:focus{outline: none;} :is(.pz,.modal-overlay) .audio-modal h4{margin: .15rem 0 .3rem; color: var(--accent); font-size: .9rem;} :is(.pz,.modal-overlay) .audio-modal .audclips{display: flex; flex-direction: column; gap: .4rem; min-height: 0;} :is(.pz,.modal-overlay) .audlist{display: flex; flex-direction: column; min-height: 2.6rem; max-height: 32vh; overflow-y: auto; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg);} :is(.pz,.modal-overlay) .audlist .hint{margin: .7rem;} :is(.pz,.modal-overlay) .audrow{display: flex; align-items: center; gap: .55rem; padding: .38rem .6rem; border-top: 1px solid var(--chrome-line); font-size: .84rem; color: var(--chrome-fg);} :is(.pz,.modal-overlay) .audrow:first-child{border-top: 0;} :is(.pz,.modal-overlay) .audrow[role="button"]{cursor: pointer;} :is(.pz,.modal-overlay) .audrow[role="button"]:hover{background: color-mix(in srgb, var(--accent) 6%, transparent);} :is(.pz,.modal-overlay) .audrow:focus-visible{outline: 2px solid var(--accent); outline-offset: -2px;} :is(.pz,.modal-overlay) .audplay{flex: none; width: 1.9rem; height: 1.9rem; border-radius: 50%; border: 1px solid var(--chrome-line); background: var(--chrome-panel); color: var(--chrome-fg); font-size: .7rem; cursor: pointer;} :is(.pz,.modal-overlay) .audplay:hover,:is(.pz,.modal-overlay) .audplay.playing{border-color: var(--accent); color: var(--accent);} :is(.pz,.modal-overlay) .audname{flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} :is(.pz,.modal-overlay) .audrow.clip .audname{display: flex; flex-direction: column; white-space: normal;} :is(.pz,.modal-overlay) .audtext{unicode-bidi: plaintext; text-align: start; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .audname small{color: var(--chrome-mut); font-size: .72rem; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .audsize{flex: none; color: var(--chrome-mut); font-size: .74rem; font-variant-numeric: tabular-nums;} :is(.pz,.modal-overlay) .audrow .ref{flex: none; padding: .05rem .35rem; border-radius: 4px; font-size: .66rem; background: color-mix(in srgb, var(--ok) 16%, transparent); color: var(--ok);} :is(.pz,.modal-overlay) .audrow .del{flex: none; border: 0; border-radius: 4px; padding: .1rem .35rem; background: none; color: var(--chrome-mut); cursor: pointer;} :is(.pz,.modal-overlay) .audrow .del:hover{background: var(--danger); color: var(--danger-fg);} :is(.pz,.modal-overlay) .audrow .btn{flex: none;} :is(.pz,.modal-overlay) .rtl-modal .rtlbox{font-family: var(--fa-font); font-size: 1.35rem; line-height: 2; min-height: 200px;} :is(.pz,.modal-overlay) .rtl-modal .rtlbox[dir="rtl"]{text-align: right;} :is(.pz,.modal-overlay) .rtl-modal .rtlbox.alt{font-family: var(--tl-alt, var(--fa-font)); line-height: max(var(--tl-alt-lh, 1), 2);} :is(.pz,.modal-overlay) .rtl-modal .rtl-opts{justify-content: flex-start; gap: 1.2rem; flex-wrap: wrap;} :is(.pz,.modal-overlay) .rtl-modal .rtl-opts label{display: inline-flex; align-items: center; gap: .4rem; font-size: .82rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .rtl-modal .rtl-opts input[type="number"]{width: 4.2rem; padding: .2rem .35rem; border-radius: 5px; border: 1px solid var(--chrome-line); background: var(--chrome-bg); color: var(--chrome-fg); font-size: .8rem;} :is(.pz,.modal-overlay) .math-modal .mathbox{font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 1rem; line-height: 1.6; min-height: 110px;} :is(.pz,.modal-overlay) .math-modal .math-opts{justify-content: flex-start; gap: 1.2rem; flex-wrap: wrap;} :is(.pz,.modal-overlay) .math-modal .math-opts label{display: inline-flex; align-items: center; gap: .4rem; font-size: .82rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .math-modal .math-stage-wrap{margin-top: .6rem;} :is(.pz,.modal-overlay) .math-modal .math-status{display: block; min-height: 1.1em; margin-bottom: .3rem;} :is(.pz,.modal-overlay) .math-modal .math-stage{margin: 0; max-width: none; box-shadow: none; min-height: 72px; padding: .8rem 1rem; display: flex; align-items: center; justify-content: center; overflow-x: auto;} :is(.pz,.modal-overlay) .math-modal .math-stage:empty::after{content: ""; display: block;} :is(.pz,.modal-overlay) .rtl-edit-btn{position: absolute; z-index: 72; display: none; border: 1px solid var(--chrome-line); border-radius: 6px; background: var(--chrome-panel); color: var(--chrome-fg); font-size: .72rem; padding: .18rem .5rem; cursor: pointer; box-shadow: 0 4px 16px rgba(0,0,0,.2);} :is(.pz,.modal-overlay) .rtl-edit-btn:hover{background: var(--accent); border-color: var(--accent); color: var(--accent-fg);} :is(.pz,.modal-overlay) .colophon{margin-top: 3em; padding-top: .7em; border-top: 1px solid var(--rulec); font-size: .72em; color: var(--graytx); line-height: 1.5;} :is(.pz,.modal-overlay) figure.latex{margin: 1.2em 0; display: block; max-width: 100%;} :is(.pz,.modal-overlay) figure.latex img{display: block; width: 100%; height: auto;} :is(.pz,.modal-overlay) figure.latex figcaption{margin-top: .35em; text-align: center;} :is(.pz,.modal-overlay) figure.latex figcaption > span{display: block; font-size: .78em; color: var(--graytx); line-height: 1.45;} :is(.pz,.modal-overlay) figure.latex.align-left figcaption{text-align: left;} :is(.pz,.modal-overlay) figure.latex.align-right figcaption{text-align: right;} :is(.pz,.modal-overlay) .ex-flashcard figure.latex{margin-top: .5em; margin-bottom: .5em;} :is(.pz,.modal-overlay) .latex-pending-block{margin: 1.2em 0; padding: .5em .8em; border: 1px dashed var(--rulec); border-radius: 6px;} :is(.pz,.modal-overlay) .latex-pending-block .latex-wait{display: block; font: .78em var(--sans); color: var(--graytx); margin-bottom: .3em;} :is(.pz,.modal-overlay) .latex-pending-block .latex-code{margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: .85em; color: var(--graytx);} :is(.pz,.modal-overlay) code.latex-pending{color: var(--graytx);} :is(.pz,.modal-overlay) .latex-waiting{position: fixed; left: 50%; top: .6rem; transform: translateX(-50%); z-index: 70; box-sizing: border-box; width: min(22rem, calc(100vw - 1.5rem)); padding: .55rem .75rem .6rem; border-radius: 8px; border: 1px solid var(--rulec); border-left: 3px solid var(--accent); background: var(--boxbg); color: var(--ink); font: .85rem/1.4 var(--sans); box-shadow: 0 8px 26px rgba(0,0,0,.16); transition: opacity .5s;} :is(.pz,.modal-overlay) .latex-waiting.gone{opacity: 0; pointer-events: none;} :is(.pz,.modal-overlay) .latex-waiting.err{border-left-color: var(--danger);} :is(.pz,.modal-overlay) .latex-waiting-say{margin: 0; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .latex-waiting-bar{height: 6px; margin: .45rem 0 0; border-radius: 3px; overflow: hidden; background: var(--rulec);} :is(.pz,.modal-overlay) .latex-waiting-bar i{display: block; height: 100%; width: 0; border-radius: 3px; background: var(--accent); transition: width .4s;} :is(.pz,.modal-overlay) .latex-waiting-again{margin-top: .45rem; font: inherit; padding: .25rem .7rem; border-radius: 6px; border: 1px solid var(--accent); background: var(--accent); color: var(--accent-fg); cursor: pointer;} @media (prefers-reduced-motion: reduce){ :is(.pz,.modal-overlay) .latex-waiting,:is(.pz,.modal-overlay) .latex-waiting-bar i{transition: none;} } @media print{ :is(.pz,.modal-overlay) .latex-waiting{display: none;} } html[data-sheet="dark"] :is(.pz,.modal-overlay) figure.latex img,html[data-sheet="dark"] :is(.pz,.modal-overlay) img.latex-inline,html[data-sheet="dark"] :is(.pz,.modal-overlay) .lx-preview-image{filter: invert(.9) hue-rotate(180deg);} :is(.pz,.modal-overlay) .latex-fail{border: 1px dashed var(--rule, #8888); border-radius: 6px; padding: .6em .8em; margin: 1em 0; font-size: .9em;} :is(.pz,.modal-overlay) .latex-fail .latex-said{margin: 0 0 .4em;} :is(.pz,.modal-overlay) .latex-fail .latex-fix{margin: .3em 0; display: flex; gap: .5em; flex-wrap: wrap;} :is(.pz,.modal-overlay) .latex-fail pre{white-space: pre-wrap; overflow-wrap: anywhere; font-size: .85em; margin: .4em 0 0; direction: ltr; text-align: left;} :is(.pz,.modal-overlay) .latex-fail .latex-log summary{cursor: pointer; font-size: .9em;} :is(.pz,.modal-overlay) .latex-fail .latex-views{margin: .4rem 0 0; display: flex; gap: .5em; flex-wrap: wrap;} :is(.pz,.modal-overlay) .topbar{position: sticky; top: 0; z-index: 40; display: flex; align-items: center; gap: .6rem; padding: .5rem .9rem; background: var(--chrome-panel); border-bottom: 1px solid var(--chrome-line);} :is(.pz,.modal-overlay) .brand{font-family: var(--serif); font-size: 1.15rem; font-weight: 700; color: var(--chrome-fg); text-decoration: none; display: flex; align-items: center; gap: .45rem;} :is(.pz,.modal-overlay) .brand-fa{font-family: var(--fa-font); background: var(--accent); color: var(--accent-fg); width: 1.7rem; height: 1.7rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 1rem; padding-bottom: .2rem;} @font-face{font-family: "TeX Gyre Chorus"; font-display: swap; src: url(fonts/texgyrechorus-mediumitalic.otf) format("opentype");} :is(.pz,.modal-overlay) .hublink{display: inline-flex; align-items: center; gap: .4rem; text-decoration: none; color: var(--chrome-mut); padding: .28rem .55rem .28rem .3rem; font-family: "TeX Gyre Chorus", "Apple Chancery", cursive; font-size: 1.2rem; line-height: 1; border-radius: 6px; border: 1px solid transparent; white-space: nowrap;} :is(.pz,.modal-overlay) .hublink:hover{color: var(--accent); border-color: var(--chrome-line);} :is(.pz,.modal-overlay) .hublink .glyph{font-family: "Noto Nastaliq Urdu", var(--fa-font); background: var(--accent); color: var(--accent-fg); width: 1.45rem; height: 1.45rem; border-radius: 50%; font-size: .85rem; display: inline-flex; align-items: center; justify-content: center; padding-bottom: .3rem;} :is(.pz,.modal-overlay) .doc-title{font-family: var(--serif); font-weight: 700; font-size: 1.05rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 0 1 auto; min-width: 0;} :is(.pz,.modal-overlay) .topbar-actions{margin-left: auto; display: flex; gap: .4rem; align-items: center; flex-wrap: wrap;} :is(.pz,.modal-overlay) .btn{display: inline-flex; align-items: center; gap: .3rem; padding: .38rem .7rem; border-radius: 6px; cursor: pointer; border: 1px solid var(--chrome-line); background: var(--chrome-panel); color: var(--chrome-fg); text-decoration: none; font-size: .88rem; line-height: 1.2; white-space: nowrap;} :is(.pz,.modal-overlay) .btn:hover{border-color: var(--accentlt); color: var(--accent);} html[data-sheet="dark"] :is(.pz,.modal-overlay) .btn:hover{color: var(--accent);} :is(.pz,.modal-overlay) .btn.primary{background: var(--accent); border-color: var(--accent); color: var(--accent-fg);} :is(.pz,.modal-overlay) .btn.primary:hover{filter: brightness(1.12); color: var(--accent-fg);} :is(.pz,.modal-overlay) .btn.danger{color: var(--danger); border-color: color-mix(in srgb, var(--danger) 40%, transparent);} :is(.pz,.modal-overlay) .btn.danger:hover{background: var(--danger); color: var(--danger-fg); border-color: var(--danger);} :is(.pz,.modal-overlay) .btn.ghost{background: transparent;} :is(.pz,.modal-overlay) .btn.small{padding: .22rem .5rem; font-size: .8rem;} :is(.pz,.modal-overlay) .btn.big{padding: .55rem 1.1rem; font-size: 1rem;} :is(.pz,.modal-overlay) .btn:disabled{opacity: .45; cursor: not-allowed; pointer-events: none;} :is(.pz,.modal-overlay) .btn:focus-visible,:is(.pz,.modal-overlay) input:focus-visible,:is(.pz,.modal-overlay) select:focus-visible,:is(.pz,.modal-overlay) textarea:focus-visible{outline: 2px solid var(--accentlt); outline-offset: 1px;} :is(.pz,.modal-overlay) .dropdown{position: relative;} :is(.pz,.modal-overlay) .dropdown summary{list-style: none;} :is(.pz,.modal-overlay) .dropdown summary::-webkit-details-marker{display: none;} :is(.pz,.modal-overlay) .dropdown .menu{position: absolute; right: 0; top: calc(100% + 4px); z-index: 60; display: flex; flex-direction: column; min-width: 175px; background: var(--chrome-panel); border: 1px solid var(--chrome-line); border-radius: 8px; box-shadow: 0 8px 26px rgba(0,0,0,.18); padding: .3rem;} :is(.pz,.modal-overlay) .dropdown .menu a,:is(.pz,.modal-overlay) .dropdown .menu button{text-align: left; padding: .45rem .6rem; border: 0; background: none; border-radius: 5px; color: var(--chrome-fg); text-decoration: none; cursor: pointer; font-size: .88rem;} :is(.pz,.modal-overlay) .dropdown .menu a:hover,:is(.pz,.modal-overlay) .dropdown .menu button:hover{background: var(--chrome-bg);} :is(.pz,.modal-overlay) .dropdown .menu .danger{color: var(--danger);} :is(.pz,.modal-overlay) .dropdown .menu a.disabled{opacity: .4; pointer-events: none;} :is(.pz,.modal-overlay) .dropdown .menu.pdf-options{width: 19rem; max-width: calc(100vw - 1.8rem); padding: .5rem .7rem; gap: .5rem; font-size: .86rem; white-space: normal;} :is(.pz,.modal-overlay) .pdf-options fieldset{border: 0; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .15rem;} :is(.pz,.modal-overlay) .pdf-options legend{font-weight: 600; padding: 0; margin-bottom: .2rem;} :is(.pz,.modal-overlay) .pdf-options label{display: flex; align-items: flex-start; gap: .45rem; cursor: pointer; padding: .15rem 0;} :is(.pz,.modal-overlay) .pdf-options input{margin: .15rem 0 0; flex: none;} :is(.pz,.modal-overlay) .pdf-options .note{margin: .1rem 0 0; color: var(--chrome-mut); font-size: .78rem; line-height: 1.35;} :is(.pz,.modal-overlay) .container{max-width: 1060px; margin: 0 auto; padding: 1.2rem;} :is(.pz,.modal-overlay) .container.narrow{max-width: 760px;} :is(.pz,.modal-overlay) .searchrow{display: flex; gap: .7rem; align-items: center; flex-wrap: wrap;} :is(.pz,.modal-overlay) .searchrow input[type="search"]{flex: 1 1 260px; padding: .55rem .8rem; border-radius: 8px; border: 1px solid var(--chrome-line); background: var(--chrome-panel); color: var(--chrome-fg); font-size: .95rem;} :is(.pz,.modal-overlay) .check{display: inline-flex; gap: .35rem; align-items: center; color: var(--chrome-mut); font-size: .85rem;} :is(.pz,.modal-overlay) select{padding: .45rem .5rem; border-radius: 7px; border: 1px solid var(--chrome-line); background: var(--chrome-panel); color: var(--chrome-fg);} :is(.pz,.modal-overlay) .tagbar{display: flex; flex-wrap: wrap; gap: .4rem; margin: .8rem 0 .2rem;} :is(.pz,.modal-overlay) .tag-filter-hint{margin: .25rem 0 0; color: var(--chrome-mut); font-size: .76rem;} :is(.pz,.modal-overlay) .tagchip{border: 1px solid var(--chrome-line); background: var(--chrome-panel); color: var(--chrome-mut); border-radius: 99px; padding: .18rem .65rem; font-size: .8rem; cursor: pointer;} :is(.pz,.modal-overlay) .tagchip .n{opacity: .6; margin-left: .25rem; font-size: .72rem;} :is(.pz,.modal-overlay) .tagchip.active{background: var(--accent); border-color: var(--accent); color: var(--accent-fg);} :is(.pz,.modal-overlay) .tagchip.active::before{content: "+"; font-weight: 700; margin-right: .2rem;} :is(.pz,.modal-overlay) .tagchip.excluded{color: var(--danger); border-color: color-mix(in srgb, var(--danger) 55%, transparent); background: color-mix(in srgb, var(--danger) 7%, var(--chrome-panel));} :is(.pz,.modal-overlay) .tagchip.excluded::before{content: "−"; font-weight: 700; margin-right: .2rem;} :is(.pz,.modal-overlay) .cards{display: grid; grid-template-columns: repeat(auto-fill, minmax(305px, 1fr)); gap: .9rem; margin-top: 1rem;} :is(.pz,.modal-overlay) .card{position: relative; display: block; text-decoration: none; color: var(--chrome-fg); background: var(--chrome-panel); border: 1px solid var(--chrome-line); border-radius: 10px; padding: .9rem 1rem .75rem; cursor: pointer; transition: border-color .12s, box-shadow .12s;} :is(.pz,.modal-overlay) .card:hover{border-color: var(--accentlt); box-shadow: 0 4px 18px rgba(190,52,85,.12);} :is(.pz,.modal-overlay) .card h3{margin: 0 0 .15rem; font-family: var(--serif); font-size: 1.08rem; line-height: 1.3; color: var(--chrome-fg); padding-right: 1.4rem;} :is(.pz,.modal-overlay) .card .sub{margin: 0 0 .5rem; font-size: .84rem; color: var(--chrome-mut); line-height: 1.5;} :is(.pz,.modal-overlay) .card .sub .fa,:is(.pz,.modal-overlay) .card h3 .fa,:is(.pz,.modal-overlay) .toc-list .fa{font-family: var(--fa-font); font-size: 1.18em; white-space: normal;} :is(.pz,.modal-overlay) .card .badges{display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .5rem;} :is(.pz,.modal-overlay) .badge{display: inline-flex; align-items: center; gap: .25rem; font-size: .72rem; border-radius: 5px; padding: .12rem .45rem; background: var(--chrome-bg); color: var(--chrome-mut); border: 1px solid var(--chrome-line);} :is(.pz,.modal-overlay) .badge.ok{color: var(--ok); border-color: color-mix(in srgb, var(--ok) 35%, transparent);} :is(.pz,.modal-overlay) .badge.warn{color: var(--warn); border-color: color-mix(in srgb, var(--warn) 40%, transparent);} :is(.pz,.modal-overlay) .badge.err{color: var(--danger); border-color: color-mix(in srgb, var(--danger) 40%, transparent);} :is(.pz,.modal-overlay) .card .tagrow{display: flex; flex-wrap: wrap; gap: .3rem;} :is(.pz,.modal-overlay) .card .tag{font-size: .72rem; background: var(--chrome-bg); border-radius: 99px; padding: .1rem .5rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .card .dates{margin-top: .5rem; font-size: .72rem; color: var(--chrome-mut); opacity: .8;} :is(.pz,.modal-overlay) .card .badge.lang{font-family: var(--fa-font); color: var(--accent); border-color: color-mix(in srgb, var(--accent) 35%, transparent);} :is(.pz,.modal-overlay) .parseh-langs{display: flex; flex-wrap: wrap; gap: .4rem; margin: .9rem 0 0;} :is(.pz,.modal-overlay) .parseh-langs .chip{border: 1px solid var(--chrome-line); background: var(--chrome-panel); color: var(--chrome-mut); border-radius: 99px; padding: .2rem .7rem; font-size: .82rem; cursor: pointer; display: inline-flex; gap: .3rem; align-items: baseline;} :is(.pz,.modal-overlay) .parseh-langs .chip .n{opacity: .6; font-size: .72rem;} :is(.pz,.modal-overlay) .parseh-langs .chip .native{font-family: var(--tl-font, inherit);} :is(.pz,.modal-overlay) .parseh-langs .chip.on{background: var(--accent); border-color: var(--accent); color: var(--accent-fg);} :is(.pz,.modal-overlay) .parseh-langs .chip.on .n{opacity: .85;} :is(.pz,.modal-overlay) .card .card-del{position: absolute; top: .55rem; right: .55rem; border: 0; background: none; color: var(--chrome-mut); font-size: 1rem; cursor: pointer; border-radius: 5px; padding: .1rem .35rem; opacity: 0;} :is(.pz,.modal-overlay) .card:hover .card-del{opacity: .7;} @media (hover:none){ :is(.pz,.modal-overlay) .card .card-del{opacity: .7;} } :is(.pz,.modal-overlay) .dk-checkout{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:8px 0 4px; padding:10px 12px;border:1px solid var(--accent);border-radius:10px; background:var(--boxbg);font-size:.95rem;line-height:1.45} :is(.pz,.modal-overlay) .dk-checkout .dk-outsay{flex:1;min-width:14rem} :is(.pz,.modal-overlay) .dk-refused{flex:1 0 100%;display:flex;flex-direction:column;gap:4px;margin-top:6px; padding-top:8px;border-top:1px dashed var(--rulec)} :is(.pz,.modal-overlay) .dk-refused .dk-label{font-size:.82rem;letter-spacing:.08em;text-transform:uppercase; color:var(--graytx)} :is(.pz,.modal-overlay) .dk-refuse{font-size:.88rem;color:var(--graytx)} :is(.pz,.modal-overlay) .card .card-del:hover{background: var(--danger); color: var(--danger-fg); opacity: 1;} :is(.pz,.modal-overlay) .empty{text-align: center; color: var(--chrome-mut); padding: 4rem 0; font-size: 1rem;} :is(.pz,.modal-overlay) .statusline{margin-top: 2rem; text-align: center; color: var(--chrome-mut); font-size: .78rem;} :is(.pz,.modal-overlay) .metabar{display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; padding: .45rem .9rem; background: var(--chrome-panel); border-bottom: 1px solid var(--chrome-line); font-size: .84rem;} :is(.pz,.modal-overlay) .tags-edit{display: flex; align-items: center; gap: .35rem; flex-wrap: wrap;} :is(.pz,.modal-overlay) .tags-label{color: var(--chrome-mut); margin-right: .15rem;} :is(.pz,.modal-overlay) .tags-edit .tag{display: inline-flex; align-items: center; gap: .25rem; background: var(--chrome-bg); border: 1px solid var(--chrome-line); border-radius: 99px; padding: .12rem .3rem .12rem .6rem; font-size: .78rem;} :is(.pz,.modal-overlay) .tags-edit .tag button{border: 0; background: none; cursor: pointer; color: var(--chrome-mut); padding: 0 .2rem; border-radius: 50%; font-size: .8rem;} :is(.pz,.modal-overlay) .tags-edit .tag button:hover{color: var(--danger);} :is(.pz,.modal-overlay) #tag-input{border: 1px dashed var(--chrome-line); background: transparent; color: var(--chrome-fg); border-radius: 99px; padding: .15rem .6rem; width: 7rem; font-size: .78rem;} :is(.pz,.modal-overlay) .buildinfo{margin-left: auto; display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;} :is(.pz,.modal-overlay) .buildinfo details{display: inline;} :is(.pz,.modal-overlay) .buildinfo summary{cursor: pointer; color: var(--danger);} :is(.pz,.modal-overlay) .buildinfo .fails{position: absolute; right: 1rem; z-index: 45; max-width: 480px; background: var(--chrome-panel); border: 1px solid var(--chrome-line); border-radius: 8px; box-shadow: 0 8px 26px rgba(0,0,0,.2); padding: .6rem .8rem; font-size: .8rem; max-height: 40vh; overflow: auto;} :is(.pz,.modal-overlay) .buildinfo .fails .fa{font-family: var(--fa-font); font-size: 1.2em;} :is(.pz,.modal-overlay) .buildinfo summary{position: relative;} :is(.pz,.modal-overlay) .vfx-cloud{position: absolute; right: 0; top: calc(100% + .45rem); z-index: 50; width: 27rem; max-width: min(72vw, 29rem); padding: .6rem .75rem; pointer-events: none; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-panel); color: var(--chrome-fg); box-shadow: 0 8px 26px rgba(0,0,0,.22); font-size: .78rem; font-weight: 400; line-height: 1.5; text-align: left; white-space: normal; cursor: default; opacity: 0; visibility: hidden; transition: opacity .12s ease;} :is(.pz,.modal-overlay) .buildinfo summary:hover .vfx-cloud{opacity: 1; visibility: visible;} :is(.pz,.modal-overlay) .buildinfo details[open] summary:hover .vfx-cloud{visibility: hidden;} :is(.pz,.modal-overlay) .vfx-cloud b{color: var(--chrome-fg);} :is(.pz,.modal-overlay) .vfx-cloud code{font-family: ui-monospace, Menlo, monospace; font-size: .92em; background: var(--chrome-bg); padding: .05em .3em; border-radius: 4px;} :is(.pz,.modal-overlay) .vfx-cloud .vfx-note{display: block; margin-top: .5rem; padding-top: .5rem; border-top: 1px solid var(--chrome-line); color: var(--chrome-mut);} :is(.pz,.modal-overlay) .vfx-cloud .vfx-hint{display: block; margin-top: .5rem; color: var(--accent); font-size: .95em;} :is(.pz,.modal-overlay) .toolbar{display: flex; align-items: center; gap: 1.1rem; flex-wrap: wrap; padding: .5rem .9rem; background: var(--chrome-panel); border-bottom: 1px solid var(--chrome-line); position: sticky; top: 0; z-index: 30; font-size: .82rem;} body[data-page="doc"] :is(.pz,.modal-overlay) .topbar,body[data-page="doc"] :is(.pz,.modal-overlay) .metabar{position: static;} @media (min-width: 561px){ body[data-page="doc"] :is(.pz,.modal-overlay) .topbar{position: relative; z-index: auto;} } :is(.pz,.modal-overlay) .sheet h2,:is(.pz,.modal-overlay) .sheet h3,:is(.pz,.modal-overlay) .voce{scroll-margin-top: var(--sticky-h, 4.6rem);} :is(.pz,.modal-overlay) input[type="range"]{accent-color: var(--accent); width: 100%; margin: 0;} :is(.pz,.modal-overlay) .typo-hint{color: var(--chrome-mut); font-size: .74rem; margin-left: auto; font-style: italic;} :is(.pz,.modal-overlay) .typo-toggle[aria-expanded="true"]{border-color: var(--accentlt); color: var(--accent);} :is(.pz,.modal-overlay) .bar-tail{display: inline-flex; align-items: center; gap: .4rem; flex: none; position: sticky; right: 0; background: var(--chrome-panel); padding-inline-start: .3rem; margin-left: auto;} :is(.pz,.modal-overlay) .bar-theme{min-width: 2.1rem; justify-content: center;} @media (max-width: 560px), (pointer: coarse){ :is(.pz,.modal-overlay) .bar-theme{min-width: 48px; min-height: 48px;} } @media (max-width: 560px){ body:is([data-page="deck"], [data-page="study"], [data-page="cram"]) :is(.pz,.modal-overlay) .topbar{flex-wrap: wrap; row-gap: .35rem;} } body.chrome-off :is(.pz,.modal-overlay) .topbar,body.chrome-off :is(.pz,.modal-overlay) .m-topbar,body.chrome-off :is(.pz,.modal-overlay) .metabar,body.chrome-off :is(.pz,.modal-overlay) .toolbar{display: none;} :is(.pz,.modal-overlay) .bars-show{position: fixed; top: .35rem; right: .5rem; z-index: 60; padding: .1rem .5rem; font-size: .78rem; line-height: 1.6; opacity: .42; transition: opacity .15s ease;} :is(.pz,.modal-overlay) .bars-show:hover,:is(.pz,.modal-overlay) .bars-show:focus-visible{opacity: 1;} @media print{ :is(.pz,.modal-overlay) .bars-show{display: none !important;} } :is(.pz,.modal-overlay) .layout{display: block;} :is(.pz,.modal-overlay) .tocpane,:is(.pz,.modal-overlay) .linkspane{position: fixed; top: 0; left: 0; z-index: 90; width: min(300px, 82vw); height: 100vh; height: 100dvh; overflow-y: auto; padding: .8rem .9rem 2rem; background: var(--chrome-panel); border-right: 1px solid var(--chrome-line); box-shadow: 6px 0 28px rgba(0,0,0,.16); font-size: .84rem; transform: translateX(-103%); transition: transform .18s ease; visibility: hidden;} body.toc-open :is(.pz,.modal-overlay) .tocpane{transform: none; visibility: visible;} :is(.pz,.modal-overlay) .linkspane{left: auto; right: 0; border-right: 0; border-left: 1px solid var(--chrome-line); box-shadow: -6px 0 28px rgba(0,0,0,.16); transform: translateX(103%);} body.links-open :is(.pz,.modal-overlay) .linkspane{transform: none; visibility: visible;} :is(.pz,.modal-overlay) .links-list{list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .7rem;} :is(.pz,.modal-overlay) .link-from{display: flex; flex-direction: column; gap: .2rem;} :is(.pz,.modal-overlay) .link-doc{color: var(--chrome-fg); font-weight: 600; text-decoration: none; overflow-wrap: anywhere; padding: .15rem .3rem; border-radius: 6px;} :is(.pz,.modal-overlay) .link-doc:hover{color: var(--accent); background: var(--chrome-bg);} :is(.pz,.modal-overlay) .link-snippet{margin: 0 .3rem; color: var(--chrome-mut); font-size: .8rem; line-height: 1.4; unicode-bidi: plaintext; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .link-snippet mark{background: none; color: var(--accent); font-weight: 600; border-bottom: 1px solid color-mix(in srgb, var(--accent) 38%, transparent);} :is(.pz,.modal-overlay) .links-empty{margin: 0 .3rem; color: var(--chrome-mut); font-style: italic;} :is(.pz,.modal-overlay) .toc-backdrop{position: fixed; inset: 0; z-index: 85; background: rgba(23,18,20,.28);} :is(.pz,.modal-overlay) .toc-head{display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .6rem; position: sticky; top: -.8rem; padding: .8rem 0 .4rem; background: var(--chrome-panel);} :is(.pz,.modal-overlay) .toc-close{padding: .15rem .45rem; line-height: 1;} :is(.pz,.modal-overlay) .navstack{display: grid; grid-template-rows: auto auto; grid-auto-flow: column; gap: .25rem; margin-right: .4rem;} :is(.pz,.modal-overlay) .navstack .btn{text-align: left;} :is(.pz,.modal-overlay) .toc-title{font-weight: 700; color: var(--chrome-mut); text-transform: uppercase; font-size: .7rem; letter-spacing: .06em;} :is(.pz,.modal-overlay) .toc-list{display: flex; flex-direction: column; gap: .1rem;} :is(.pz,.modal-overlay) .toc-list a{color: var(--chrome-fg); text-decoration: none; padding: .22rem .5rem; border-radius: 6px; line-height: 1.35;} :is(.pz,.modal-overlay) .toc-list a:hover{background: var(--chrome-panel); color: var(--accent);} :is(.pz,.modal-overlay) .toc-list .secnum{color: var(--accentlt); font-weight: 700; margin-right: .2rem;} :is(.pz,.modal-overlay) .toc-list .toc-sub{padding-left: 1.4rem; color: var(--chrome-mut); font-size: .93em;} :is(.pz,.modal-overlay) .toc-list .toc-voce{display: flex; align-items: baseline; gap: .5rem; padding: .28rem .5rem;} :is(.pz,.modal-overlay) .toc-list .toc-voce .fa{font-size: 1.35em;} :is(.pz,.modal-overlay) .toc-list .toc-tr{color: var(--chrome-mut); font-style: italic; font-size: .9em;} :is(.pz,.modal-overlay) .readpane{min-width: 0; padding: 0 1rem;} :is(.pz,.modal-overlay) .pdfframe{display: block; width: min(960px, 100%); margin: 1.2rem auto 2rem; height: calc(100vh - 8.5rem); border: 1px solid var(--chrome-line); border-radius: 4px; background: #525659;} :is(.pz,.modal-overlay) .split{display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); grid-template-rows: minmax(0, 1fr); height: calc(100vh - 3.05rem); overflow: hidden;} :is(.pz,.modal-overlay) .editor-pane,:is(.pz,.modal-overlay) .preview-pane{min-height: 0;} :is(.pz,.modal-overlay) .editor-pane{border-right: 1px solid var(--chrome-line); display: flex; position: relative;} :is(.pz,.modal-overlay) .src-mirror{position: absolute; top: 0; left: -200vw; visibility: hidden; white-space: pre-wrap; overflow-wrap: break-word; word-break: normal; tab-size: 4; pointer-events: none;} :is(.pz,.modal-overlay) .src-mirror > div{unicode-bidi: inherit;} :is(.pz,.modal-overlay) #src{flex: 1; width: 100%; border: 0; resize: none; outline: none; padding: 1.1rem 1.2rem; background: var(--chrome-panel); color: var(--chrome-fg); font: 13.5px/1.55 ui-monospace, "SF Mono", Menlo, monospace; tab-size: 4;} :is(.pz,.modal-overlay) #src[dir="rtl"]{text-align: right;} :is(.pz,.modal-overlay) #src[data-face]{font-family: var(--src-face); font-size: 15px;} :is(.pz,.modal-overlay) .preview-pane{display: flex; flex-direction: column; min-width: 0;} :is(.pz,.modal-overlay) .preview-head{display: flex; justify-content: space-between; align-items: center; padding: .35rem .9rem; font-size: .78rem; color: var(--chrome-mut); border-bottom: 1px solid var(--chrome-line); background: var(--chrome-panel);} :is(.pz,.modal-overlay) .pv-status{font-size: .78rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .pv-status.err{color: var(--danger);} :is(.pz,.modal-overlay) .preview-head{gap: .6rem;} :is(.pz,.modal-overlay) .preview-head .pv-status{margin-inline-start: auto;} :is(.pz,.modal-overlay) .pv-own-tab{font-size: .72rem; padding: .12rem .5rem;} :is(.pz,.modal-overlay) .preview-scroll{overflow-y: auto; flex: 1;} :is(.pz,.modal-overlay) .livebar{display: flex; align-items: center; gap: .7rem; flex-wrap: wrap; padding: .35rem .9rem; font-size: .82rem; color: var(--chrome-mut); background: var(--chrome-panel); border-bottom: 1px solid var(--chrome-line);} :is(.pz,.modal-overlay) .livebar[hidden]{display: none;} :is(.pz,.modal-overlay) .live-pill{white-space: nowrap; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; border-radius: 99px; padding: .08rem .55rem; background: var(--accent); color: var(--accent-fg);} :is(.pz,.modal-overlay) .live-say{flex: 1; min-width: 12rem;} :is(.pz,.modal-overlay) .live-follow{display: inline-flex; align-items: center; gap: .3rem; cursor: pointer; white-space: nowrap;} :is(.pz,.modal-overlay) .editor-livebar{height: 2.4rem; box-sizing: border-box; flex-wrap: nowrap; overflow: hidden;} :is(.pz,.modal-overlay) .editor-livebar .live-say{overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} :is(.pz,.modal-overlay) .editor-livebar:not([hidden]) + .split{height: calc(100vh - 3.05rem - 2.4rem);} :is(.pz,.modal-overlay) .split.own-tab{grid-template-columns: minmax(0, 1fr);} :is(.pz,.modal-overlay) .split.own-tab .preview-pane{display: none;} :is(.pz,.modal-overlay) .split.own-tab .editor-pane{border-right: 0;} @media (max-width: 900px){ :is(.pz,.modal-overlay) .editor-livebar{height: auto; flex-wrap: wrap; overflow: visible;} :is(.pz,.modal-overlay) .editor-livebar .live-say{white-space: normal; min-width: 10rem;} :is(.pz,.modal-overlay) .editor-livebar:not([hidden]) + .split{height: calc(100vh - 3.05rem);} :is(.pz,.modal-overlay) .split.own-tab{grid-template-rows: minmax(0, 1fr);} } body[data-live="1"] :is(.pz,.modal-overlay) #btn-build,body[data-live="1"] :is(.pz,.modal-overlay) #pdf-options,body[data-live="1"] :is(.pz,.modal-overlay) #btn-pdf-toggle,body[data-live="1"] :is(.pz,.modal-overlay) #btn-add-all,body[data-live="1"] :is(.pz,.modal-overlay) .metabar,body[data-live="1"] :is(.pz,.modal-overlay) .topbar-actions > .dropdown,body[data-live="1"] :is(.pz,.modal-overlay) .topbar-actions > a.btn[href$="/edit"],body[data-live="1"] :is(.pz,.modal-overlay) #btn-backlinks,body[data-live="1"] :is(.pz,.modal-overlay) #btn-stop{display: none;} :is(.pz,.modal-overlay) .preview-scroll .sheet{margin: 1rem auto 3rem;} :is(.pz,.modal-overlay) .insert-group{display: inline-flex; flex-wrap: wrap; gap: .15rem; margin-right: .3rem;} :is(.pz,.modal-overlay) .insert-group .btn{padding: .3rem .45rem;} :is(.pz,.modal-overlay) .colour-tool{display: inline-flex; position: relative;} :is(.pz,.modal-overlay) .colour-tool .colour-main{display: inline-flex; align-items: center; gap: .3rem; border-radius: 6px 0 0 6px;} :is(.pz,.modal-overlay) .colour-tool .colour-pick > summary{border-radius: 0 6px 6px 0; padding-inline: .32rem;} :is(.pz,.modal-overlay) .colour-tool .menu{min-width: 11rem;} :is(.pz,.modal-overlay) .colour-tool .menu button,:is(.pz,.modal-overlay) .colour-custom{display: flex; align-items: center; gap: .48rem;} :is(.pz,.modal-overlay) .colour-active,:is(.pz,.modal-overlay) .colour-chip{display: inline-block; width: .78rem; height: .78rem; flex: none; border-radius: 50%; background: var(--fac-teal);} :is(.pz,.modal-overlay) .colour-active.fac-crimson,:is(.pz,.modal-overlay) .colour-chip.fac-crimson{background: var(--fac-crimson);} :is(.pz,.modal-overlay) .colour-active.fac-indigo,:is(.pz,.modal-overlay) .colour-chip.fac-indigo{background: var(--fac-indigo);} :is(.pz,.modal-overlay) .colour-active.fac-teal,:is(.pz,.modal-overlay) .colour-chip.fac-teal{background: var(--fac-teal);} :is(.pz,.modal-overlay) .colour-active.fac-violet,:is(.pz,.modal-overlay) .colour-chip.fac-violet{background: var(--fac-violet);} :is(.pz,.modal-overlay) .colour-active.fac-amber,:is(.pz,.modal-overlay) .colour-chip.fac-amber{background: var(--fac-amber);} :is(.pz,.modal-overlay) .colour-chip.custom{background: conic-gradient(#d23 0 20%, #fc3 0 40%, #3a6 0 60%, #38c 0 80%, #a4c 0);} :is(.pz,.modal-overlay) .colour-chip.none{background: transparent; border: 1px solid var(--chrome-line); color: var(--chrome-mut); text-align: center; line-height: .68rem;} :is(.pz,.modal-overlay) .colour-custom{padding: .45rem .6rem; cursor: pointer; font-size: .88rem;} :is(.pz,.modal-overlay) .colour-custom:hover{background: var(--chrome-bg); border-radius: 5px;} :is(.pz,.modal-overlay) .colour-custom input{width: 1.5rem; height: 1.2rem; margin-left: auto; padding: 0; border: 0; background: transparent;} @media (max-width: 1100px){ body[data-page="edit"] :is(.pz,.modal-overlay) .topbar{flex-wrap: wrap; gap: .4rem;} body[data-page="edit"] :is(.pz,.modal-overlay) .topbar-actions{display: contents;} body[data-page="edit"] :is(.pz,.modal-overlay) .doc-title{flex: 1 1 0; min-width: 3rem;} body[data-page="edit"] :is(.pz,.modal-overlay) .insert-group{margin-right: 0;} body[data-page="edit"] :is(.pz,.modal-overlay) .topbar .colour-tool,body[data-page="edit"] :is(.pz,.modal-overlay) .topbar .dropdown{position: static;} body[data-page="edit"] :is(.pz,.modal-overlay) .topbar .dropdown .menu{right: .9rem;} } :is(.pz,.modal-overlay) .hint{color: var(--chrome-mut);} :is(.pz,.modal-overlay) .prompt-box{background: var(--chrome-panel); border: 1px solid var(--chrome-line); border-radius: 10px; padding: .8rem 1rem; margin: 1rem 0;} :is(.pz,.modal-overlay) .prompt-box-head{display: flex; justify-content: space-between; align-items: center; margin-bottom: .5rem; font-weight: 600;} :is(.pz,.modal-overlay) #prompt-text,:is(.pz,.modal-overlay) #question{width: 100%; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg); color: var(--chrome-fg); padding: .8rem; font: 13px/1.5 ui-monospace, "SF Mono", Menlo, monospace; resize: vertical;} :is(.pz,.modal-overlay) #prompt-text[readonly]{opacity: .92;} :is(.pz,.modal-overlay) #question{font-family: inherit; font-size: .95rem;} :is(.pz,.modal-overlay) .prompt-target{display: inline-flex; align-items: center; gap: .4rem; font-size: .8rem; font-weight: 400; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .prompt-target select{padding: .2rem .4rem; font-size: .82rem;} :is(.pz,.modal-overlay) .qlabel{margin: 1.2rem 0 .4rem;} :is(.pz,.modal-overlay) .row{display: flex; gap: .8rem; align-items: center; margin: .8rem 0;} :is(.pz,.modal-overlay) .workflow-hint{margin-top: 1.6rem; padding: .9rem 1.1rem; border-radius: 10px; background: var(--chrome-panel); border: 1px solid var(--chrome-line); color: var(--chrome-mut); font-size: .86rem; line-height: 1.6;} :is(.pz,.modal-overlay) .pp{background: var(--chrome-panel); border: 1px solid var(--chrome-line); border-radius: 10px; padding: .8rem 1rem; margin: .8rem 0 1rem;} :is(.pz,.modal-overlay) .pp-title{margin: 0 0 .25rem; font-size: 1rem;} :is(.pz,.modal-overlay) .pp .pp-why{margin: 0 0 .7rem; color: var(--chrome-mut); font-size: .84rem;} :is(.pz,.modal-overlay) .pp-busy{margin: 0 0 .7rem; color: var(--warn); font-size: .84rem;} :is(.pz,.modal-overlay) .pp-busy:empty{display: none;} :is(.pz,.modal-overlay) .pp-presets{display: flex; flex-wrap: wrap; gap: .4rem; margin: 0 0 .8rem;} :is(.pz,.modal-overlay) .pp-preset{border: 1px solid var(--chrome-line); background: var(--chrome-panel); color: var(--chrome-mut); border-radius: 99px; padding: .22rem .75rem; font-size: .82rem; cursor: pointer;} :is(.pz,.modal-overlay) .pp-preset:not([aria-pressed="true"]):hover:not(:disabled){border-color: var(--accentlt); color: var(--accent);} :is(.pz,.modal-overlay) .pp-preset[aria-pressed="true"]{background: var(--accent); border-color: var(--accent); color: var(--accent-fg);} :is(.pz,.modal-overlay) .pp-preset:disabled{opacity: .5; cursor: not-allowed;} :is(.pz,.modal-overlay) .pp-group{border: 0; margin: 0 0 .55rem; padding: 0; min-width: 0;} :is(.pz,.modal-overlay) .pp-group legend{padding: 0; margin: 0 0 .1rem; color: var(--chrome-mut); font-size: .76rem; font-weight: 700;} :is(.pz,.modal-overlay) .pp-box{display: grid; grid-template-columns: auto minmax(0, 1fr) auto; column-gap: .55rem; align-items: baseline; padding: .3rem .35rem; border-radius: 6px; cursor: pointer;} :is(.pz,.modal-overlay) .pp-box:hover{background: var(--chrome-bg);} :is(.pz,.modal-overlay) .pp-box input{grid-row: 1 / span 3; align-self: start; margin: .2rem 0 0; accent-color: var(--accent);} :is(.pz,.modal-overlay) .pp-name{font-weight: 600; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .pp-size{color: var(--chrome-mut); font-size: .78rem; font-variant-numeric: tabular-nums; white-space: nowrap;} :is(.pz,.modal-overlay) .pp-says{grid-column: 2 / 4; color: var(--chrome-mut); font-size: .8rem; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .pp-offwhy{grid-column: 2 / 4; color: var(--warn); font-size: .78rem; font-style: italic;} :is(.pz,.modal-overlay) .pp-offwhy:empty{display: none;} :is(.pz,.modal-overlay) .pp-box.pp-off{cursor: not-allowed;} :is(.pz,.modal-overlay) .pp-box.pp-off .pp-name,:is(.pz,.modal-overlay) .pp-box.pp-off .pp-says{opacity: .55;} :is(.pz,.modal-overlay) .pp-total{position: sticky; bottom: 0; margin: .6rem -1rem -.8rem; padding: .55rem 1rem; background: var(--chrome-panel); border-top: 1px solid var(--chrome-line); border-radius: 0 0 10px 10px; font-size: .84rem; color: var(--chrome-fg);} :is(.pz,.modal-overlay) .pp-total:empty{display: none;} :is(.pz,.modal-overlay) .pp-under{display: flex; flex-wrap: wrap; align-items: center; gap: .4rem 1.2rem; margin: .6rem 0 0;} :is(.pz,.modal-overlay) .pp-under:empty{display: none;} :is(.pz,.modal-overlay) .pp-pick{display: inline-flex; align-items: center; gap: .4rem; font-size: .84rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .pp-pick select,:is(.pz,.modal-overlay) .pp-options select{max-width: 100%; padding: .2rem .4rem; font: inherit; font-size: .84rem; border: 1px solid var(--chrome-line); border-radius: 6px; background: var(--chrome-panel); color: var(--chrome-fg);} :is(.pz,.modal-overlay) .pp-options .llmrow,:is(.pz,.modal-overlay) .pp-options .llmrow-opts{margin: 0;} :is(.pz,.modal-overlay) .pp-options .llmrow-opt{color: var(--chrome-mut); font-size: .84rem;} :is(.pz,.modal-overlay) .modal.ex-prompt-modal{max-height: calc(100vh - 2rem);} :is(.pz,.modal-overlay) .ex-prompt-body{display: flex; flex-direction: column; gap: .8rem; min-height: 0; overflow-y: auto;} :is(.pz,.modal-overlay) .ex-prompt-body > *{flex-shrink: 0;} :is(.pz,.modal-overlay) .ex-prompt-body .pp{margin: 0; background: var(--chrome-bg);} :is(.pz,.modal-overlay) .ex-prompt-body .pp-box:hover{background: var(--chrome-panel);} :is(.pz,.modal-overlay) .ex-prompt-body .pp-under{margin: 0;} .modal-overlay{position: fixed; inset: 0; z-index: 100; background: rgba(23,18,20,.55); display: flex; align-items: center; justify-content: center; padding: 1rem;} :is(.pz,.modal-overlay) .modal{background: var(--chrome-panel); color: var(--chrome-fg); border-radius: 12px; width: min(700px, 94vw); max-height: 88vh; display: flex; flex-direction: column; gap: .8rem; padding: 1.1rem 1.2rem; box-shadow: 0 20px 60px rgba(0,0,0,.35);} :is(.pz,.modal-overlay) .modal h3:not(:where(.sheet h3)){margin: 0;} :is(.pz,.modal-overlay) .modal p:not(:where(.sheet p)){margin: 0; color: var(--chrome-mut); font-size: .86rem;} :is(.pz,.modal-overlay) .modal textarea:not(:where(.sheet textarea)){width: 100%; min-height: 260px; resize: vertical; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg); color: var(--chrome-fg); padding: .7rem; font: 12.5px/1.5 ui-monospace, Menlo, monospace;} :is(.pz,.modal-overlay) .modal .row{justify-content: flex-end; margin: 0;} :is(.pz,.modal-overlay) .latex-view-modal{width: min(900px, 96vw);} :is(.pz,.modal-overlay) .latex-view-pre{margin: 0; min-height: 8rem; max-height: 60vh; overflow: auto; position: relative; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg); color: var(--chrome-fg); padding: .6rem .7rem; font: 12.5px/1.45 ui-monospace, Menlo, monospace; white-space: pre-wrap; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .latex-view-pre .latex-view-ln{display: block; min-height: 1.45em;} :is(.pz,.modal-overlay) .latex-view-pre .latex-view-ln.mark{background: color-mix(in srgb, #c33 18%, transparent); border-inline-start: 3px solid #c33; padding-inline-start: 5px; margin-inline-start: -8px;} :is(.pz,.modal-overlay) .modal-fields{display: flex; flex-direction: column; gap: .5rem;} :is(.pz,.modal-overlay) .modal-field{display: flex; flex-direction: column; gap: .25rem; font-size: .8rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .modal-field input{border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg); color: var(--chrome-fg); padding: .4rem .6rem; font-size: .9rem;} :is(.pz,.modal-overlay) .modal-fields ~ textarea{min-height: 120px;} :is(.pz,.modal-overlay) .modal.latex-modal{width: min(1100px, 96vw); height: min(780px, 88vh); max-height: 88vh; gap: 0; padding: 0; overflow: hidden;} :is(.pz,.modal-overlay) .latex-modal-head{flex: none; padding: 1rem 1.2rem .8rem; border-bottom: 1px solid var(--chrome-line);} :is(.pz,.modal-overlay) .latex-modal-head p{margin-top: .35rem !important; max-width: 70rem;} :is(.pz,.modal-overlay) .latex-modal-body{display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(20rem, .9fr); grid-template-areas: "preview editor"; flex: 1 1 auto; min-height: 0; overflow: hidden;} :is(.pz,.modal-overlay) .lx-preview-pane{grid-area: preview; min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: .55rem; padding: 1rem 1.1rem; overflow: auto; background: var(--chrome-bg); border-right: 1px solid var(--chrome-line);} :is(.pz,.modal-overlay) .lx-preview-head{display: flex; align-items: center; justify-content: space-between; gap: .6rem; flex-wrap: wrap;} :is(.pz,.modal-overlay) .lx-preview-head > b{font-size: .82rem;} :is(.pz,.modal-overlay) .latex-modal .lx-status{display: block; min-height: 1.1em; margin: 0;} :is(.pz,.modal-overlay) .latex-modal .lx-status a{color: var(--accent); font-weight: 600; white-space: nowrap;} :is(.pz,.modal-overlay) .latex-modal .lx-stage{margin: 0; max-width: none; min-height: 21rem; flex: 1 1 auto; display: flex; align-items: center; justify-content: center; overflow: auto; padding: clamp(.8rem, 2vw, 1.6rem); border: 1px solid var(--chrome-line); border-radius: 9px; box-shadow: none; background: var(--sheet-bg);} :is(.pz,.modal-overlay) .latex-modal .lx-stage:empty::after{content: "The drawing will appear here."; color: var(--chrome-mut); font: .82rem var(--sans);} :is(.pz,.modal-overlay) .lx-preview-image{display: block; width: 100%; height: auto; max-width: calc(var(--lx-w, 100000) * 12px); max-height: 100%; object-fit: contain;} :is(.pz,.modal-overlay) .lx-preview-views{width: 100%; margin: .5rem 0 0; display: flex; gap: .5rem; flex-wrap: wrap;} :is(.pz,.modal-overlay) .lx-preview-detail{width: 100%; margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font: 12px/1.45 ui-monospace, Menlo, monospace;} :is(.pz,.modal-overlay) .lx-editor-pane{grid-area: editor; min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: .85rem; padding: 1rem 1.2rem; overflow: auto;} :is(.pz,.modal-overlay) .lx-field{display: flex; flex-direction: column; gap: .28rem; color: var(--chrome-mut); font-size: .82rem;} :is(.pz,.modal-overlay) .lx-field > span{color: var(--chrome-fg); font-weight: 600;} :is(.pz,.modal-overlay) .lx-field > span small{color: var(--chrome-mut); font-weight: 400;} :is(.pz,.modal-overlay) .lx-field select,:is(.pz,.modal-overlay) .lx-field input[type="text"],:is(.pz,.modal-overlay) .lx-layout select,:is(.pz,.modal-overlay) .lx-layout input[type="number"]{border: 1px solid var(--chrome-line); border-radius: 7px; background: var(--chrome-bg); color: var(--chrome-fg); padding: .42rem .55rem; font: inherit;} :is(.pz,.modal-overlay) .latex-modal .lx-src{min-height: 15rem; flex: 1 1 18rem; font-size: .88rem;} :is(.pz,.modal-overlay) .lx-layout{flex: none; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg);} :is(.pz,.modal-overlay) .lx-layout summary{cursor: pointer; padding: .65rem .75rem; color: var(--accent); font-size: .82rem; font-weight: 600;} :is(.pz,.modal-overlay) .lx-layout[open] summary{border-bottom: 1px solid var(--chrome-line);} :is(.pz,.modal-overlay) .lx-layout > p{margin: .6rem .75rem 0; color: var(--chrome-mut); font-size: .78rem; line-height: 1.4;} :is(.pz,.modal-overlay) .lx-layout-fields{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem .85rem; padding: .75rem;} :is(.pz,.modal-overlay) .lx-layout-fields label{display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .35rem .55rem; color: var(--chrome-mut); font-size: .78rem;} :is(.pz,.modal-overlay) .lx-layout-fields .lx-natural-field{grid-column: 1 / -1; display: flex; justify-content: flex-start;} :is(.pz,.modal-overlay) .lx-layout-fields .lx-width{grid-column: 1 / -1; width: 100%;} :is(.pz,.modal-overlay) .lx-layout-fields input[type="range"]{accent-color: var(--accent);} :is(.pz,.modal-overlay) .lx-layout-fields output{color: var(--chrome-fg); font-variant-numeric: tabular-nums;} :is(.pz,.modal-overlay) .lx-layout-fields .lx-offset{width: 5em;} :is(.pz,.modal-overlay) .latex-modal-actions{display: flex; flex: none; justify-content: flex-end; gap: .6rem; padding: .8rem 1.2rem; border-top: 1px solid var(--chrome-line); background: var(--chrome-panel);} @media (max-width: 760px){ .modal-overlay.latex-overlay{align-items: stretch; padding: .5rem;} :is(.pz,.modal-overlay) .modal.latex-modal{width: 100%; height: calc(100vh - 1rem); height: calc(100dvh - 1rem); max-height: none; border-radius: 10px;} :is(.pz,.modal-overlay) .latex-modal-head{padding: .85rem 1rem .7rem;} :is(.pz,.modal-overlay) .latex-modal-body{grid-template-columns: minmax(0, 1fr); grid-template-rows: max-content max-content; grid-template-areas: "editor" "preview"; overflow: auto;} :is(.pz,.modal-overlay) .lx-editor-pane,:is(.pz,.modal-overlay) .lx-preview-pane{overflow: visible; padding: .85rem 1rem;} :is(.pz,.modal-overlay) .lx-preview-pane{min-height: 0; border-right: 0; border-top: 1px solid var(--chrome-line);} :is(.pz,.modal-overlay) .latex-modal .lx-src{min-height: 11rem; flex: none;} :is(.pz,.modal-overlay) .latex-modal .lx-stage{min-height: 15rem; flex: none;} :is(.pz,.modal-overlay) .lx-preview-image{max-height: 70vh;} :is(.pz,.modal-overlay) .lx-layout-fields{grid-template-columns: minmax(0, 1fr);} :is(.pz,.modal-overlay) .lx-layout-fields .lx-natural-field{grid-column: 1;} :is(.pz,.modal-overlay) .latex-modal-actions{padding: .7rem 1rem calc(.7rem + env(safe-area-inset-bottom));} } :is(.pz,.modal-overlay) .names-modal{width: min(600px, 94vw);} :is(.pz,.modal-overlay) .names-list{display: flex; flex-direction: column; gap: .7rem; overflow-y: auto; min-height: 0;} :is(.pz,.modal-overlay) .names-pair{display: flex; flex-direction: column; gap: .55rem; margin: 0; border: 1px solid var(--chrome-line); border-radius: 10px; padding: .55rem .8rem .75rem;} :is(.pz,.modal-overlay) .names-pair legend{padding: 0 .35rem; font-size: .84rem; font-weight: 600; color: var(--chrome-fg); overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .names-field input{width: 100%; box-sizing: border-box;} :is(.pz,.modal-overlay) .names-field input.bad{border-color: var(--danger); outline: 1px solid var(--danger);} :is(.pz,.modal-overlay) .names-label{display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .6rem; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .names-open{color: var(--accent); font-size: .78rem; text-decoration: none;} :is(.pz,.modal-overlay) .names-open:hover{text-decoration: underline;} :is(.pz,.modal-overlay) .names-same{color: var(--chrome-mut); font-style: italic; font-size: .82rem;} :is(.pz,.modal-overlay) .names-problem,:is(.pz,.modal-overlay) .modal p.names-error{color: var(--danger); font-size: .8rem; line-height: 1.35; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .dl-modal{width: min(560px, 94vw);} :is(.pz,.modal-overlay) .dl-filter,:is(.pz,.modal-overlay) .dl-text{width: 100%; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg); color: var(--chrome-fg); padding: .4rem .6rem; font-size: .9rem;} :is(.pz,.modal-overlay) .dl-list{display: flex; flex-direction: column; gap: .2rem; max-height: 42vh; overflow-y: auto; border: 1px solid var(--chrome-line); border-radius: 8px; padding: .3rem;} :is(.pz,.modal-overlay) .dl-item{display: flex; flex-direction: column; gap: .1rem; text-align: left; padding: .4rem .55rem; border-radius: 6px; cursor: pointer; border: 1px solid transparent; background: none; color: var(--chrome-fg);} :is(.pz,.modal-overlay) .dl-item:hover{background: var(--chrome-bg);} :is(.pz,.modal-overlay) .dl-item.on{background: var(--accent); border-color: var(--accent); color: var(--accent-fg);} :is(.pz,.modal-overlay) .dl-item .dl-t{font-size: .92rem;} :is(.pz,.modal-overlay) .dl-item .dl-s{font-size: .76rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .dl-item.on .dl-s{color: color-mix(in srgb, var(--accent-fg) 78%, transparent);} :is(.pz,.modal-overlay) .dl-empty{color: var(--chrome-mut); padding: .8rem; text-align: center; font-size: .85rem;} :is(.pz,.modal-overlay) .ex-from-deck-modal .dl-list{margin-top: .5rem;} :is(.pz,.modal-overlay) .ex-from-deck-modal .dl-item .dl-s{white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} :is(.pz,.modal-overlay) .ex-from-deck-modal .dl-item.dk-broken .dl-t::after{content: " · needs attention"; color: var(--danger); font-size: .76rem;} :is(.pz,.modal-overlay) .ex-from-deck-modal .dl-item.dk-broken.on .dl-t::after{color: var(--accent-fg);} :is(.pz,.modal-overlay) .dl-textrow{display: flex; flex-direction: column; gap: .25rem; font-size: .8rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .gl-modal{width: min(940px, 96vw); gap: .7rem;} :is(.pz,.modal-overlay) .gl-head{display: flex; align-items: baseline; gap: .7rem;} :is(.pz,.modal-overlay) .gl-head h3{flex: 0 0 auto;} :is(.pz,.modal-overlay) .gl-count{color: var(--chrome-mut); font-size: .82rem;} :is(.pz,.modal-overlay) .gl-head .gl-x{margin-left: auto; padding: .15rem .45rem; line-height: 1;} :is(.pz,.modal-overlay) .gl-tabs{display: flex; gap: .3rem;} :is(.pz,.modal-overlay) .gl-tabs .btn.on{background: var(--accent); border-color: var(--accent); color: var(--accent-fg);} :is(.pz,.modal-overlay) .gl-tabs .gl-lemma{margin-left: auto;} :is(.pz,.modal-overlay) .gl-filter{width: 100%; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg); color: var(--chrome-fg); padding: .4rem .6rem; font-size: .9rem;} :is(.pz,.modal-overlay) .gl-body{overflow-y: auto; min-height: 220px;} :is(.pz,.modal-overlay) .gl-table{width: 100%; border-collapse: collapse; font-size: .92rem;} :is(.pz,.modal-overlay) .gl-table th{position: sticky; top: 0; z-index: 1; background: var(--chrome-panel); text-align: left; font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--chrome-mut); padding: .35rem .6rem; border-bottom: 1px solid var(--chrome-line);} :is(.pz,.modal-overlay) .gl-table td{padding: .34rem .6rem; border-bottom: 1px solid var(--chrome-line); vertical-align: baseline;} :is(.pz,.modal-overlay) .gl-table tr:last-child td{border-bottom: 0;} :is(.pz,.modal-overlay) .gl-table tr:hover td{background: var(--chrome-bg);} :is(.pz,.modal-overlay) .gl-table.dir-rtl th:first-child{text-align: right;} :is(.pz,.modal-overlay) .gl-table th.sortable{cursor: pointer; user-select: none;} :is(.pz,.modal-overlay) .gl-table th.sortable:hover{color: var(--accent);} :is(.pz,.modal-overlay) .gl-table th.sortable:focus-visible{outline: 2px solid var(--accentlt); outline-offset: -2px;} :is(.pz,.modal-overlay) .gl-table th.on{color: var(--accent);} :is(.pz,.modal-overlay) .gl-ar{font-size: .85em; margin-left: .3em;} :is(.pz,.modal-overlay) .gl-fa{font-family: var(--fa-font); font-size: 1.5em; line-height: 1.5; unicode-bidi: isolate; white-space: nowrap; width: 1%;} :is(.pz,.modal-overlay) .gl-fa[dir="rtl"]{text-align: right;} :is(.pz,.modal-overlay) .gl-kana{font-family: var(--fa-font); color: var(--chrome-mut); white-space: nowrap;} :is(.pz,.modal-overlay) .gl-tr{font-style: italic; color: var(--chrome-mut); white-space: nowrap;} :is(.pz,.modal-overlay) .gl-tx{width: 99%;} :is(.pz,.modal-overlay) .gl-empty{color: var(--chrome-mut); padding: 1.4rem .6rem; text-align: center;} :is(.pz,.modal-overlay) .gl-table tr.gl-guessed td{color: var(--danger);} :is(.pz,.modal-overlay) .gl-table tr.gl-guessed:hover td{background: color-mix(in srgb, var(--danger) 7%, transparent);} :is(.pz,.modal-overlay) .gl-warn{position: relative; display: inline-block; margin-left: .4em;} :is(.pz,.modal-overlay) .gl-warn-x{display: inline-flex; align-items: center; justify-content: center; width: 1.05em; height: 1.05em; border-radius: 50%; cursor: help; background: var(--danger); color: var(--danger-fg); font-size: .78em; font-weight: 700; line-height: 1;} :is(.pz,.modal-overlay) .gl-cloud{position: fixed; z-index: 110; width: 20rem; max-width: min(60vw, 22rem); padding: .55rem .7rem; border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-panel); color: var(--chrome-fg); box-shadow: 0 8px 26px rgba(0,0,0,.22); font-size: .82rem; font-style: normal; line-height: 1.45; text-align: left; opacity: 0; visibility: hidden; transition: opacity .12s ease;} :is(.pz,.modal-overlay) .gl-cloud code{font-family: ui-monospace, Menlo, monospace; font-size: .92em; background: var(--chrome-bg); padding: .05em .3em; border-radius: 4px;} :is(.pz,.modal-overlay) .gl-warn:hover .gl-cloud,:is(.pz,.modal-overlay) .gl-warn:focus-within .gl-cloud{opacity: 1; visibility: visible;} :is(.pz,.modal-overlay) .gl-card .a-tx.guessed{color: var(--danger);} :is(.pz,.modal-overlay) .gl-card .a-warn{color: var(--danger); font-size: .78rem; max-width: 24rem;} :is(.pz,.modal-overlay) .gl-card{display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .9rem; text-align: center; min-height: 260px; padding: 1.4rem 1rem; cursor: pointer; border: 1px solid var(--chrome-line); border-radius: 12px; background: var(--chrome-bg); user-select: none;} :is(.pz,.modal-overlay) .gl-card:hover{border-color: var(--accentlt);} :is(.pz,.modal-overlay) .gl-card .q{font-family: var(--fa-font); font-size: 3.1rem; line-height: 1.45; unicode-bidi: isolate; color: var(--chrome-fg);} :is(.pz,.modal-overlay) .gl-card .a{display: flex; flex-direction: column; gap: .35rem;} :is(.pz,.modal-overlay) .gl-card .a-kana{font-family: var(--fa-font); font-size: 1.3rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .gl-card .a-tr{font-style: italic; color: var(--accent); font-size: 1.15rem;} :is(.pz,.modal-overlay) .gl-card .a-tx{font-size: 1.3rem; color: var(--chrome-fg);} :is(.pz,.modal-overlay) .gl-card .tap{color: var(--chrome-mut); font-size: .8rem;} :is(.pz,.modal-overlay) .gl-foot{display: flex; align-items: center; gap: .6rem;} :is(.pz,.modal-overlay) .gl-progress{color: var(--chrome-mut); font-size: .8rem; font-variant-numeric: tabular-nums;} :is(.pz,.modal-overlay) .gl-foot .grow{margin-left: auto;} :is(.pz,.modal-overlay) .dropdown.disabled > summary{pointer-events: none; opacity: .5;} :is(.pz,.modal-overlay) .totop{position: fixed; left: 1rem; bottom: 1.4rem; z-index: 118; box-shadow: 0 4px 16px rgba(0,0,0,.18);} @media (max-width: 560px){ :is(.pz,.modal-overlay) .topbar,:is(.pz,.modal-overlay) .toolbar{transition: transform .18s ease;} body.barhidden :is(.pz,.modal-overlay) .topbar,body.barhidden :is(.pz,.modal-overlay) .toolbar{transform: translateY(-100%);} body[data-page="doc"] :is(.pz,.modal-overlay) .topbar{position: sticky; top: 0; flex-wrap: wrap; row-gap: .35rem;} body[data-page="doc"] :is(.pz,.modal-overlay) .doc-title{flex: 1 1 0; min-width: 3rem;} body[data-page="doc"] :is(.pz,.modal-overlay) .topbar-actions{flex: 1 0 100%; margin-left: 0; flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; padding-block: 2px; scroll-padding-inline-end: 7rem;} body[data-page="doc"] :is(.pz,.modal-overlay) .topbar .dropdown{position: static;} body[data-page="doc"] :is(.pz,.modal-overlay) .topbar .dropdown .menu{right: .9rem;} body[data-page="doc"] :is(.pz,.modal-overlay) .toolbar{top: var(--topbar-h, 0px); gap: .6rem 1.1rem;} body[data-page="doc"] :is(.pz,.modal-overlay) .navstack{display: flex; flex-direction: row; flex-wrap: wrap;} body[data-page="doc"] :is(.pz,.modal-overlay) .toolbar{padding-block: .2rem; flex-wrap: nowrap;} body[data-page="doc"] :is(.pz,.modal-overlay) .navstack{flex: 1 1 0; min-width: 0;} body[data-page="doc"] :is(.pz,.modal-overlay) .toolbar > :not(.navstack):not(.typo-toggle){display: none;} body.barhidden[data-page="doc"] :is(.pz,.modal-overlay) .toolbar{transform: translateY(calc(-100% - var(--topbar-h, 0px)));} body[data-page="doc"] :is(.pz,.modal-overlay) .metabar input{scroll-margin-top: calc(var(--topbar-h, 0px) + .5rem);} } :is(.pz,.modal-overlay) .toast{position: fixed; left: 50%; bottom: 1.6rem; transform: translateX(-50%); z-index: 120; background: #241e21; color: #fff; border-radius: 99px; padding: .5rem 1.1rem; font-size: .86rem; box-shadow: 0 6px 24px rgba(0,0,0,.3); transition: opacity .25s; max-width: 80vw;} :is(.pz,.modal-overlay) .toast.err{background: var(--danger); color: var(--danger-fg);} :is(.pz,.modal-overlay) .shutdown-overlay{position: fixed; inset: 0; z-index: 200; background: color-mix(in srgb, var(--chrome-bg) 82%, transparent); backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; text-align: center;} :is(.pz,.modal-overlay) .shutdown-overlay h2{margin: 0 0 .4rem;} :is(.pz,.modal-overlay) .shutdown-overlay code{background: var(--chrome-panel); padding: .15rem .4rem; border-radius: 5px;} :is(.pz,.modal-overlay) .btn .spin{width: .85em; height: .85em; border-radius: 50%; border: 2px solid currentColor; border-top-color: transparent; animation: spin .8s linear infinite; display: inline-block;} @keyframes spin{to { transform: rotate(360deg); }} :is(.pz,.modal-overlay) .made-work{box-sizing: border-box; width: 23rem; max-width: 100%; margin: .6rem 0 0; padding: .6rem .75rem .55rem; border-radius: 8px; background: var(--chrome-panel); color: var(--chrome-fg); border: 1px solid var(--chrome-line); border-left: 3px solid var(--accent); font-size: .86rem; line-height: 1.4;} :is(.pz,.modal-overlay) .made-work.hang{position: absolute; right: .9rem; top: calc(100% + 4px); z-index: 59; margin: 0; max-width: calc(100vw - 1.8rem); box-shadow: 0 8px 26px rgba(0,0,0,.18);} :is(.pz,.modal-overlay) .made-work.err{border-left-color: var(--danger);} :is(.pz,.modal-overlay) .made-work.err .made-say{color: var(--danger);} :is(.pz,.modal-overlay) .made-say{margin: 0; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .made-work .bar{height: 6px; margin: .5rem 0 .45rem; border-radius: 3px; overflow: hidden; background: var(--chrome-line);} :is(.pz,.modal-overlay) .made-work .bar i{display: block; height: 100%; border-radius: 3px; background: var(--accent); transition: width .4s;} :is(.pz,.modal-overlay) .made-work .bar.loose i{width: 30%; animation: made-slide 1.4s ease-in-out infinite;} @keyframes made-slide{0% { margin-inline-start: -30%; } 100% { margin-inline-start: 100%; }} @media (prefers-reduced-motion: reduce){ :is(.pz,.modal-overlay) .made-work .bar.loose i{width: 100%; opacity: .45; animation: none;} } :is(.pz,.modal-overlay) .made-row{display: flex; align-items: center; gap: .4rem;} :is(.pz,.modal-overlay) .made-work.err .made-row{margin-top: .5rem;} :is(.pz,.modal-overlay) .made-when{margin-right: auto; color: var(--chrome-mut); font-size: .8rem; font-variant-numeric: tabular-nums;} @media (max-width: 900px){ :is(.pz,.modal-overlay) .split{grid-template-columns: 1fr; grid-template-rows: 45vh minmax(0, 1fr);} :is(.pz,.modal-overlay) .editor-pane{border-right: 0; border-bottom: 1px solid var(--chrome-line);} } @media print{ :is(.pz,.modal-overlay) .topbar,:is(.pz,.modal-overlay) .toolbar,:is(.pz,.modal-overlay) .metabar,:is(.pz,.modal-overlay) .tocpane,:is(.pz,.modal-overlay) .linkspane,:is(.pz,.modal-overlay) .toc-backdrop,:is(.pz,.modal-overlay) .toast,:is(.pz,.modal-overlay) .dropdown,:is(.pz,.modal-overlay) .pdfframe,:is(.pz,.modal-overlay) #modal-root,:is(.pz,.modal-overlay) .fapal,:is(.pz,.modal-overlay) .fncloud,:is(.pz,.modal-overlay) .imgpanel,:is(.pz,.modal-overlay) .exercise-correction,:is(.pz,.modal-overlay) .ex-edit,:is(.pz,.modal-overlay) .ex-to-deck,:is(.pz,.modal-overlay) .video-edit,:is(.pz,.modal-overlay) .audio-edit{display: none !important;} body[data-page="doc"] :is(.pz,.modal-overlay) figure.img:hover img,body[data-page="edit"] :is(.pz,.modal-overlay) figure.img:hover img{outline: none;} :is(.pz,.modal-overlay){background: #fff;} :is(.pz,.modal-overlay) .layout{display: block;} :is(.pz,.modal-overlay) .readpane{padding: 0;} :is(.pz,.modal-overlay) .sheet{box-shadow: none; margin: 0 auto; max-width: none; border-radius: 0;} :is(.pz,.modal-overlay) .sheet .fa:hover{background: none;} } :is(.pz,.modal-overlay) .dk-title{margin: 0; font-family: var(--serif); font-size: 1.6rem; line-height: 1.25; color: var(--chrome-fg); overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .dk-empty p{max-width: 38rem; margin-left: auto; margin-right: auto;} :is(.pz,.modal-overlay) .dk-sr{position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;} :is(.pz,.modal-overlay) .btn.dk-off{opacity: .45; pointer-events: none; cursor: not-allowed;} :is(.pz,.modal-overlay) .dk-study{display: inline-flex; align-items: baseline; gap: .3rem; font-weight: 700; font-variant-numeric: tabular-nums;} :is(.pz,.modal-overlay) .dk-n.dk-new{color: var(--fac-indigo);} :is(.pz,.modal-overlay) .dk-n.dk-learn{color: var(--danger);} :is(.pz,.modal-overlay) .dk-n.dk-rev{color: var(--ok);} :is(.pz,.modal-overlay) .dk-n.dk-zero{color: var(--chrome-mut); font-weight: 400;} :is(.pz,.modal-overlay) .dk-n.dk-current{text-decoration: underline 2px; text-underline-offset: .22em;} :is(.pz,.modal-overlay) .dk-sep{color: var(--chrome-mut); font-weight: 400;} :is(.pz,.modal-overlay) .dk-label{margin-right: .4rem; color: var(--chrome-mut); font-size: .8rem;} :is(.pz,.modal-overlay) .dk-next{margin-left: .55rem; color: var(--chrome-mut); font-size: .8rem;} :is(.pz,.modal-overlay) .card.dk-card{display: flex; flex-direction: column; cursor: default;} :is(.pz,.modal-overlay) .card.dk-card h3 a{color: inherit; text-decoration: none;} :is(.pz,.modal-overlay) .card.dk-card h3 a:hover{color: var(--accent);} :is(.pz,.modal-overlay) .dk-card-study{display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem 0; min-height: 1.4em; color: var(--chrome-mut); font-size: .88rem;} :is(.pz,.modal-overlay) .dk-card-actions{display: flex; align-items: center; gap: .4rem; margin-top: auto; padding-top: .75rem;} :is(.pz,.modal-overlay) .dk-card-actions .dropdown{margin-left: auto;} :is(.pz,.modal-overlay) .dk-deckhead{display: flex; flex-direction: column; gap: .6rem; padding: 1rem 1.1rem; background: var(--chrome-panel); border: 1px solid var(--chrome-line); border-radius: 10px;} :is(.pz,.modal-overlay) .dk-titlerow{display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;} :is(.pz,.modal-overlay) .badge.dk-lang{font-size: .78rem; color: var(--accent); border-color: color-mix(in srgb, var(--accent) 35%, transparent);} :is(.pz,.modal-overlay) .dk-counts{display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem 1.1rem; color: var(--chrome-mut); font-size: .88rem;} :is(.pz,.modal-overlay) .dk-now{display: inline-flex; align-items: baseline; flex-wrap: wrap;} :is(.pz,.modal-overlay) .dk-deckactions{display: flex; flex-wrap: wrap; align-items: center; gap: .45rem;} :is(.pz,.modal-overlay) .dk-deckactions .dropdown .menu{left: 0; right: auto;} :is(.pz,.modal-overlay) .dk-deckactions .dk-push{margin-left: auto;} :is(.pz,.modal-overlay) .dk-browsebar{margin-top: 1.3rem;} :is(.pz,.modal-overlay) .dk-source-filter .menu{left: 0; right: auto; width: 20rem; max-width: calc(100vw - 1.8rem);} :is(.pz,.modal-overlay) .dk-source-menu{max-height: min(22rem, calc(100vh - 8rem)); overflow-y: auto; white-space: normal;} :is(.pz,.modal-overlay) .dk-source-menu fieldset{border: 0; margin: 0; padding: .15rem .25rem; min-width: 0;} :is(.pz,.modal-overlay) .dk-source-menu legend{padding: 0; margin: 0 0 .25rem; font-size: .82rem; font-weight: 600;} :is(.pz,.modal-overlay) .dk-source-option{display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .45rem; align-items: start; padding: .35rem .25rem; cursor: pointer; line-height: 1.3;} :is(.pz,.modal-overlay) .dk-source-option:hover{background: var(--chrome-bg); border-radius: 5px;} :is(.pz,.modal-overlay) .dk-source-option.dk-source-zero{color: var(--chrome-mut);} :is(.pz,.modal-overlay) .dk-source-option input{margin: .15rem 0 0;} :is(.pz,.modal-overlay) .dk-source-name{overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .dk-source-count{color: var(--chrome-mut); font-variant-numeric: tabular-nums; white-space: nowrap;} :is(.pz,.modal-overlay) .dk-bulkbar{display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-top: .55rem;} :is(.pz,.modal-overlay) .dk-selection-hint{margin: .35rem 0 0; color: var(--chrome-mut); font-size: .82rem;} :is(.pz,.modal-overlay) #browse-selected{color: var(--chrome-mut); font-size: .82rem; margin-right: auto;} :is(.pz,.modal-overlay) .dk-browse-count{margin-left: auto; color: var(--chrome-mut); font-size: .82rem; font-variant-numeric: tabular-nums; white-space: nowrap;} :is(.pz,.modal-overlay) .dk-list{display: flex; flex-direction: column; gap: .5rem; margin-top: .9rem;} :is(.pz,.modal-overlay) .dk-row{display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: .25rem .9rem; align-items: start; padding: .6rem .8rem; cursor: pointer; background: var(--chrome-panel); border: 1px solid var(--chrome-line); border-radius: 10px; transition: border-color .12s;} :is(.pz,.modal-overlay) .dk-row:hover{border-color: var(--accentlt);} :is(.pz,.modal-overlay) .dk-row.open{border-color: var(--accent);} :is(.pz,.modal-overlay) .dk-row.selected{border-color: var(--accent); background: color-mix(in srgb, var(--accent) 7%, var(--chrome-panel));} :is(.pz,.modal-overlay) .dk-select{grid-column: 1; grid-row: 1 / span 2; width: 1.15rem; height: 1.15rem; margin: .15rem 0 0; cursor: pointer;} :is(.pz,.modal-overlay) .dk-row-toggle{grid-column: 2; display: flex; flex-direction: column; align-items: flex-start; gap: .15rem; min-width: 0; padding: 0; border: 0; background: none; color: var(--chrome-fg); font: inherit; text-align: start; cursor: pointer;} :is(.pz,.modal-overlay) .dk-row-toggle:focus-visible{outline: 2px solid var(--accentlt); outline-offset: 3px; border-radius: 4px;} :is(.pz,.modal-overlay) .dk-kickers{display: flex; align-items: center; gap: .45rem;} :is(.pz,.modal-overlay) .dk-kickers .badge{font-size: .66rem; padding: .02rem .35rem;} :is(.pz,.modal-overlay) .dk-excerpt{font-size: .96rem; line-height: 1.4; overflow-wrap: anywhere; unicode-bidi: plaintext; text-align: start;} :is(.pz,.modal-overlay) .dk-row-meta{grid-column: 2; display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .65rem; color: var(--chrome-mut); font-size: .76rem;} :is(.pz,.modal-overlay) .dk-row-meta a{color: var(--accentlt);} :is(.pz,.modal-overlay) .dk-item-tags{color: var(--accentlt);} :is(.pz,.modal-overlay) .dk-state{padding: .02rem .4rem; border: 1px solid; border-radius: 5px; font-size: .7rem; line-height: 1.35;} :is(.pz,.modal-overlay) .dk-state-new{color: var(--fac-indigo); border-color: color-mix(in srgb, var(--fac-indigo) 40%, transparent);} :is(.pz,.modal-overlay) .dk-state-learning{color: var(--danger); border-color: color-mix(in srgb, var(--danger) 40%, transparent);} :is(.pz,.modal-overlay) .dk-state-review{color: var(--ok); border-color: color-mix(in srgb, var(--ok) 40%, transparent);} :is(.pz,.modal-overlay) .dk-row-actions{grid-column: 3; grid-row: 1 / span 2; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: .3rem; max-width: 25rem;} :is(.pz,.modal-overlay) .dk-row-preview{grid-column: 1 / -1; margin-top: .45rem; cursor: default;} :is(.pz,.modal-overlay) .sheet.dk-sheet{width: 100%; max-width: none; margin: 0; padding: clamp(.8rem, 2.5vw, 1.4rem); border: 1px solid var(--chrome-line); border-radius: 10px; box-shadow: none; background: var(--sheet-bg); color: var(--ink);} :is(.pz,.modal-overlay) .sheet.dk-sheet > .exercise:first-child{margin-top: 0;} :is(.pz,.modal-overlay) .sheet.dk-sheet > .exercise:last-child{margin-bottom: 0;} :is(.pz,.modal-overlay) .sheet.dk-sheet .ex-edit,:is(.pz,.modal-overlay) .sheet.dk-sheet .ex-to-deck,:is(.pz,.modal-overlay) .sheet.dk-sheet .exercise-correction{display: none;} :is(.pz,.modal-overlay) .sheet.dk-sheet .footnotes{margin-top: 1.4em;} :is(.pz,.modal-overlay) .dk-study-page{max-width: 820px;} :is(.pz,.modal-overlay) .dk-studyhead{display: flex; align-items: baseline; justify-content: space-between; gap: .4rem 1rem; flex-wrap: wrap; margin-bottom: .9rem;} :is(.pz,.modal-overlay) .dk-studyhead .dk-title{font-size: 1.3rem;} :is(.pz,.modal-overlay) .dk-studyhead .dk-study{font-size: 1.1rem; gap: .4rem;} :is(.pz,.modal-overlay) .dk-study-actions{display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: .9rem;} :is(.pz,.modal-overlay) .dk-study-actions .dk-grow{flex: 1;} :is(.pz,.modal-overlay) .dk-keys{color: var(--chrome-mut); font-size: .76rem;} :is(.pz,.modal-overlay) .dk-result{margin-top: .9rem; font: 700 1.05rem/1.3 var(--sans);} :is(.pz,.modal-overlay) .dk-result.ok{color: var(--ok);} :is(.pz,.modal-overlay) .dk-result.err{color: var(--danger);} :is(.pz,.modal-overlay) .dk-solution{margin-top: .7rem;} :is(.pz,.modal-overlay) .dk-solution-head{margin: 0 0 .4rem; color: var(--chrome-mut); font: 600 .78rem/1.3 var(--sans); letter-spacing: .04em; text-transform: uppercase;} :is(.pz,.modal-overlay) .dk-rating{display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; margin-top: .9rem;} :is(.pz,.modal-overlay) .btn.dk-rate{flex-direction: column; justify-content: center; gap: .1rem; padding: .5rem .4rem .55rem; border-top-width: 3px; font-size: .98rem; white-space: normal;} :is(.pz,.modal-overlay) .dk-rate .dk-word{font-weight: 600;} :is(.pz,.modal-overlay) .dk-rate .dk-ivl{min-height: 1.1em; color: var(--chrome-mut); font-size: .78rem; font-variant-numeric: tabular-nums;} :is(.pz,.modal-overlay) .dk-rate .dk-key{color: var(--chrome-mut); font-size: .64rem;} :is(.pz,.modal-overlay) .dk-rate[data-rating="again"]{border-top-color: var(--danger);} :is(.pz,.modal-overlay) .dk-rate[data-rating="hard"]{border-top-color: var(--warn);} :is(.pz,.modal-overlay) .dk-rate[data-rating="good"]{border-top-color: var(--ok);} :is(.pz,.modal-overlay) .dk-rate[data-rating="easy"]{border-top-color: var(--fac-indigo);} :is(.pz,.modal-overlay) .dk-done{padding: 3rem 1rem; text-align: center; background: var(--chrome-panel); border: 1px solid var(--chrome-line); border-radius: 10px;} :is(.pz,.modal-overlay) .dk-done h2{margin: 0 0 .45rem; font-family: var(--serif);} :is(.pz,.modal-overlay) .dk-done p{margin: 0 0 .6rem; color: var(--chrome-mut);} :is(.pz,.modal-overlay) .dk-done .dk-when::first-letter{text-transform: uppercase;} :is(.pz,.modal-overlay) .dk-done-actions{display: flex; justify-content: center; gap: .5rem; margin-top: 1rem;} :is(.pz,.modal-overlay) .dk-done .dk-cram-tally{margin: 0 0 .4rem;} :is(.pz,.modal-overlay) .dk-cram-list{max-width: 640px; margin: 1.4rem auto 0; text-align: start;} :is(.pz,.modal-overlay) .dk-cram-head{margin: 0 0 .45rem; color: var(--chrome-mut); font: 600 .78rem/1.3 var(--sans); letter-spacing: .04em; text-transform: uppercase;} :is(.pz,.modal-overlay) .dk-cram-items{list-style: none; margin: 0 0 .6rem; padding: 0; display: flex; flex-direction: column; gap: .4rem;} :is(.pz,.modal-overlay) .dk-cram-item{display: flex; flex-direction: column; align-items: flex-start; gap: .12rem; width: 100%; padding: .55rem .8rem; border: 1px solid var(--chrome-line); border-radius: 10px; background: var(--chrome-panel); color: var(--chrome-fg); font: inherit; text-align: start; cursor: pointer;} :is(.pz,.modal-overlay) .dk-cram-item:hover{border-color: var(--accentlt);} :is(.pz,.modal-overlay) .dk-cram-item[aria-expanded="true"]{border-color: var(--accent);} :is(.pz,.modal-overlay) .dk-cram-item:focus-visible{outline: 2px solid var(--accentlt); outline-offset: 2px;} :is(.pz,.modal-overlay) .dk-cram-meta{color: var(--chrome-mut); font-size: .76rem;} :is(.pz,.modal-overlay) .dk-cram-solved{margin-top: .4rem;} :is(.pz,.modal-overlay) .dk-modal{width: min(560px, 94vw);} :is(.pz,.modal-overlay) .dk-modal .modal-field > span{color: var(--chrome-fg); font-weight: 600;} :is(.pz,.modal-overlay) .dk-modal .modal-field small,:is(.pz,.modal-overlay) .dk-modal .dk-help{color: var(--chrome-mut); font-size: .74rem; line-height: 1.35;} :is(.pz,.modal-overlay) .dk-modal .modal-field select{border: 1px solid var(--chrome-line); border-radius: 8px; background: var(--chrome-bg); color: var(--chrome-fg); padding: .4rem .6rem; font-size: .9rem;} :is(.pz,.modal-overlay) .dk-modal .dk-check{color: var(--chrome-fg); font-size: .9rem;} :is(.pz,.modal-overlay) .dk-modal .dk-running{margin: 0; padding-left: 1.2rem; color: var(--chrome-fg); font-size: .86rem;} :is(.pz,.modal-overlay) .dk-modal .dk-running li{unicode-bidi: plaintext; overflow-wrap: anywhere; margin: .15rem 0;} :is(.pz,.modal-overlay) .dk-ask .dk-others{margin: 0 0 .9rem; padding-left: 1.2rem; color: var(--chrome-fg); font-size: .9rem;} :is(.pz,.modal-overlay) .dk-ask .dk-others li{margin: .2rem 0; overflow-wrap: anywhere;} :is(.pz,.modal-overlay) .dk-ask .dk-others small{margin-inline-start: .3rem;} :is(.pz,.modal-overlay) .dk-ask .dk-others small{color: var(--chrome-mut); font-size: .76rem;} :is(.pz,.modal-overlay) .dk-ask .row{flex-wrap: wrap;} :is(.pz,.modal-overlay) .badge.dk-linked{color: var(--accent); border-color: color-mix(in srgb, var(--accent) 40%, transparent);} :is(.pz,.modal-overlay) .ex-author-field .dk-fixed-side{color: var(--chrome-mut); font-size: .74rem; line-height: 1.35;} :is(.pz,.modal-overlay) .dk-options-modal{width: min(680px, 96vw);} :is(.pz,.modal-overlay) .dk-options{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem 1rem; overflow-y: auto;} :is(.pz,.modal-overlay) .dk-raw-modal{width: min(760px, 96vw);} @media (max-width: 620px){ :is(.pz,.modal-overlay) .dk-row{grid-template-columns: auto minmax(0, 1fr);} :is(.pz,.modal-overlay) .dk-row-actions{grid-column: 2; grid-row: auto;} :is(.pz,.modal-overlay) .dk-rating{grid-template-columns: repeat(2, minmax(0, 1fr));} :is(.pz,.modal-overlay) .dk-options{grid-template-columns: minmax(0, 1fr);} } :is(.pz,.modal-overlay) .kp-keep,:is(.pz,.modal-overlay) .kp-drop{font:inherit;font-size:15px;min-height:48px;padding:6px 12px; border:1px solid var(--rulec);border-radius:10px;background:var(--chrome-panel);color:var(--chrome-fg); cursor:pointer} :is(.pz,.modal-overlay) .kp-keep.kp-have{border-color:var(--accent);color:var(--accent); background:color-mix(in srgb, var(--accent) 15%, var(--chrome-panel))} :is(.pz,.modal-overlay) .kp-keep[disabled],:is(.pz,.modal-overlay) .kp-drop[disabled]{opacity:.6;cursor:progress} :is(.pz,.modal-overlay) .kp-keep[disabled]{cursor:not-allowed} :is(.pz,.modal-overlay) .kp-drop{color:var(--chrome-mut)} :is(.pz,.modal-overlay) .kp-drop[hidden]{display:none} :is(.pz,.modal-overlay) .kp-btn{display:flex;width:100%;gap:8px;align-items:stretch; min-height:0;padding:0;border:0;border-radius:0;background:none;cursor:auto} :is(.pz,.modal-overlay) .kp-btn > .kp-keep,:is(.pz,.modal-overlay) .kp-btn > .kp-drop{flex:1 1 0;min-width:0; white-space:normal;line-height:1.25} :is(.pz,.modal-overlay) .kp-said{flex:1 0 100%;margin:6px 0 0;font-size:13.5px;line-height:1.4;color:var(--chrome-mut)} :is(.pz,.modal-overlay) .kp-said.kp-bad{color:var(--warn)} :is(.pz,.modal-overlay) .kp-back{position:fixed;inset:0;z-index:440;display:flex;align-items:flex-end; justify-content:center;background:rgba(0,0,0,.4);direction:ltr} :is(.pz,.modal-overlay) .kp-sheet{width:min(560px,100%);max-height:86vh;overflow-y:auto;padding:18px 18px calc(18px + env(safe-area-inset-bottom));background:var(--chrome-panel); border-radius:16px 16px 0 0;color:var(--chrome-fg)} :is(.pz,.modal-overlay) .kp-h{margin:0 0 6px;font-size:19px} :is(.pz,.modal-overlay) .kp-what,:is(.pz,.modal-overlay) .kp-lead{margin:0 0 10px;color:var(--chrome-mut);font-size:14.5px;line-height:1.5} :is(.pz,.modal-overlay) .kp-pickall{display:flex;gap:8px;margin-bottom:8px} :is(.pz,.modal-overlay) .kp-small{font:inherit;font-size:13.5px;min-height:40px;padding:4px 12px;border-radius:9px; border:1px solid var(--rulec);background:var(--chrome-bg);color:var(--chrome-fg);cursor:pointer} :is(.pz,.modal-overlay) .kp-list{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin-bottom:10px} :is(.pz,.modal-overlay) .kp-row{display:flex;align-items:center;gap:10px;width:80%;min-height:48px;padding:6px 10px; border:1px solid var(--rulec);border-radius:10px;font-size:14.5px; touch-action:none;-webkit-user-select:none;user-select:none} :is(.pz,.modal-overlay) .kp-row input{width:22px;height:22px;flex:none;accent-color:var(--accent)} :is(.pz,.modal-overlay) .kp-name{display:flex;flex-direction:column;justify-content:center;gap:1px; flex:1;min-width:0} :is(.pz,.modal-overlay) .kp-top{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} :is(.pz,.modal-overlay) .kp-sub{font-size:12.5px;line-height:1.3;color:var(--chrome-mut); overflow:hidden;text-overflow:ellipsis;white-space:nowrap} :is(.pz,.modal-overlay) .kp-size{flex:none;color:var(--chrome-mut);font-variant-numeric:tabular-nums} :is(.pz,.modal-overlay) .kp-row.kp-torn{border-color:var(--warn)} :is(.pz,.modal-overlay) .kp-whytorn{color:var(--warn)} :is(.pz,.modal-overlay) .kp-check{margin:0 0 10px;font-size:13.5px;line-height:1.45;color:var(--chrome-mut)} :is(.pz,.modal-overlay) .kp-check.kp-bad{color:var(--warn)} :is(.pz,.modal-overlay) .kp-aside{margin:-4px 0 10px;font-size:13px;line-height:1.45;color:var(--chrome-mut)} :is(.pz,.modal-overlay) .kp-aside[hidden]{display:none} :is(.pz,.modal-overlay) .kp-sum{margin:0 0 12px;font-size:15px;font-weight:600} :is(.pz,.modal-overlay) .kp-btns{display:flex;gap:10px;justify-content:flex-end} :is(.pz,.modal-overlay) .kp-go,:is(.pz,.modal-overlay) .kp-no{font:inherit;font-size:15px;min-height:48px;padding:8px 18px;border-radius:10px; border:1px solid var(--rulec);background:var(--chrome-bg);color:var(--chrome-fg);cursor:pointer} :is(.pz,.modal-overlay) .kp-go{border-color:var(--accent);background:var(--accent);color:var(--accent-fg)} :is(.pz,.modal-overlay) .kp-bar{position:fixed;z-index:415;left:50%;transform:translateX(-50%); bottom:calc(12px + env(safe-area-inset-bottom));display:flex;align-items:center;flex-wrap:wrap; gap:10px;max-width:min(560px,94vw);padding:12px 14px;background:var(--chrome-panel); border:1px solid var(--accent);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.2); font-size:14.5px;line-height:1.4} html.pg-sheet :is(.pz,.modal-overlay) .kp-bar{display:none} :is(.pz,.modal-overlay) .kp-off{display:inline-flex;align-items:center;min-height:36px;padding:4px 12px;border-radius:20px; background:var(--warn);color:#fff;font-size:13px;text-decoration:none;white-space:nowrap} :is(.pz,.modal-overlay) .kp-off:hover{opacity:.9} :is(.pz,.modal-overlay) .kp-again{display:inline-flex;align-items:center;justify-content:center;min-height:36px; min-width:36px;padding:0 10px;margin-inline-start:6px;border:1px solid var(--warn); border-radius:20px;background:none;color:var(--warn);font:inherit;font-size:17px;line-height:1; cursor:pointer} :is(.pz,.modal-overlay) .kp-again:hover{background:var(--warn);color:#fff} :is(.pz,.modal-overlay) .kp-wait{display:inline-flex;align-items:center;min-height:36px;padding:4px 12px;border-radius:20px; border:1px dashed var(--chrome-line);color:var(--chrome-mut);font-size:13px;white-space:nowrap} :is(.pz,.modal-overlay) .kp-away{opacity:.72} :is(.pz,.modal-overlay) .kp-note{margin-top:6px;font-size:13.5px;line-height:1.45;color:var(--chrome-mut)} :is(.pz,.modal-overlay) [data-parseh-warm]{margin:12px 0 4px;padding:10px 14px;border-radius:12px; border:1px solid var(--rulec);background:var(--chrome-panel);color:var(--chrome-mut); font-size:14.5px;line-height:1.45;font-variant-numeric:tabular-nums} :is(.pz,.modal-overlay) [data-parseh-warm][hidden]{display:none} :is(.pz,.modal-overlay) [data-parseh-warm].kp-ready{border-color:var(--accent);color:var(--chrome-fg)} :is(.pz,.modal-overlay) .m-kept{display:flex;flex-direction:column;gap:8px} :is(.pz,.modal-overlay) .m-keptopen{display:block;text-decoration:none;color:inherit} :is(.pz,.modal-overlay) .m-keptoff{font:inherit;font-size:14px;min-height:48px;border:1px solid var(--rulec); border-radius:10px;background:var(--chrome-bg);color:var(--chrome-mut);cursor:pointer} :is(.pz,.modal-overlay) .m-keptoff:hover{border-color:var(--danger);color:var(--danger)} :is(.pz,.modal-overlay) .m-keptwhy{margin:0;font-size:13.5px;line-height:1.45;color:var(--warn)} :is(.pz,.modal-overlay) .buildinfo .fails pre{margin:0;white-space:pre-wrap; font-family:ui-monospace,Menlo,monospace;font-size:.78rem} :is(.pz,.modal-overlay) #study-stage .ex-step-bar,:is(.pz,.modal-overlay) #cram-stage .ex-step-bar{display: none;} :is(.pz,.modal-overlay) .make-state{display: inline-flex; align-items: center; gap: 8px;} :is(.pz,.modal-overlay) .make-state progress{width: 120px; height: 10px; accent-color: var(--accent);} :is(.pz,.modal-overlay) .make-state .make-say{font-size: 13px; color: var(--chrome-mut, var(--dim, #635358));} :is(.pz,.modal-overlay) .make-state [hidden]{display: none !important;} :is(.pz,.modal-overlay) .ex-check-row{margin: 10px 0 2px;}