:root{--desk:#ebe8e1;--sheet:#f8f6f1;--ink:#1c1d20;--ink-soft:#4d4c48;--rule:#c4bfb3;--brick:#8f3520;--blue:#1f3f73;--mark:var(--brick);--word:48px}body[data-mark=blue]{--mark:var(--blue)}body[data-mark=none]{--mark:var(--ink)}*{box-sizing:border-box}html,body{margin:0}body{background:var(--desk);color:var(--ink);font-family:Golos Text,system-ui,sans-serif;font-size:15px;line-height:1.5}[hidden]{display:none!important}button{font:inherit;color:var(--ink);cursor:pointer}button:focus-visible,textarea:focus-visible,input:focus-visible{outline:2px solid var(--ink);outline-offset:2px}header{border-bottom:1px solid var(--rule);flex-wrap:wrap;align-items:baseline;gap:8px 24px;padding:18px 32px;display:flex}header .name{font-size:16px;font-weight:600}header .tag,header .doc{color:var(--ink-soft)}header .doc b{color:var(--ink);font-weight:500}header{align-items:center}header .load{background:var(--sheet);border:1px solid var(--ink);padding:6px 14px;font-weight:500}header .load:hover{background:var(--ink);color:var(--sheet)}.open{flex-direction:column;gap:20px;padding:20px;display:flex}.open .row{flex-wrap:wrap;align-items:center;gap:12px 16px;display:flex}.open-h{margin:0 0 16px;font-size:17px;font-weight:600}.drop{border:1px solid var(--rule);padding:28px 24px 32px}.drop.over{border-color:var(--ink);background:var(--desk)}.open .main{background:var(--ink);color:var(--sheet);border:none;padding:14px 18px;font-weight:500}.open .main:disabled{background:var(--rule);color:var(--ink-soft);cursor:default}.link label{margin-bottom:8px;font-weight:600;display:block}.link input{min-width:0;font:inherit;color:var(--ink);background:var(--sheet);border:1px solid var(--rule);flex:1;padding:11px 14px;font-size:16px}.link button{background:var(--sheet);border:1px solid var(--ink);padding:11px 16px;font-weight:500}.link button:hover{background:var(--ink);color:var(--sheet)}.link .row{flex-wrap:nowrap;gap:0}.link .row input{border-right:none}.status{min-height:1.5em;color:var(--ink-soft);margin:0}.status.err{color:var(--brick)}.hint{color:var(--ink-soft);font-variant-numeric:tabular-nums}nav{border-bottom:1px solid var(--rule);scrollbar-width:none;padding:0 32px;display:flex;overflow-x:auto}nav button{color:var(--ink-soft);white-space:nowrap;background:0 0;border:none;border-bottom:2px solid #0000;padding:12px 16px}nav button i{margin-right:6px;font-size:12px;font-style:normal}nav button.on{color:var(--ink);border-bottom-color:var(--ink);font-weight:500}nav button:disabled{cursor:default}.work{grid-template-columns:1fr 340px;gap:24px;padding:24px 32px 32px;display:grid}.sheet{background:var(--sheet);border:1px solid var(--rule);grid-template-rows:auto 1fr auto;grid-template-columns:minmax(0,1fr);align-self:start;min-width:0;min-height:470px;display:grid}.meta{border-bottom:1px solid var(--rule);color:var(--ink-soft);font-variant-numeric:tabular-nums;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:12px 20px;font-size:13px;display:flex}.meta-r{flex-wrap:wrap;align-items:baseline;gap:4px 16px;display:flex}.meta .quiet{color:var(--ink);text-decoration:underline;-webkit-text-decoration-color:var(--rule);text-decoration-color:var(--rule);text-underline-offset:3px;background:0 0;border:none;padding:0;font-size:13px}body.reading .about{visibility:hidden}body.reading header,body.reading nav{opacity:.35}body.reading header:hover,body.reading nav:hover,body.reading nav:focus-within{opacity:1}.stage{align-items:center;min-height:240px;display:flex;position:relative;overflow:hidden}.word{width:100%;font-size:var(--word);white-space:pre;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);font-weight:500;display:grid}.word .l{text-align:right}.word .orp{color:var(--mark);font-weight:600}.gap{background:linear-gradient(var(--ink) 0 22px, transparent 22px calc(100% - 22px), var(--ink) calc(100% - 22px));width:1px;height:120px;margin:-60px 0 0 -.5px;position:absolute;top:50%;left:50%}.line{text-align:center;width:100%;padding:0 24px}body[data-mode=chunks] .line{font-size:var(--word);white-space:nowrap;font-weight:500}body[data-mode=sentence] .line{text-align:left;max-width:34ch;margin:0 auto;font-size:28px;line-height:1.45}.pagetext{justify-self:center;width:100%;max-width:72ch;max-height:60vh;padding:24px 28px;font-size:18px;line-height:1.65;overflow-y:auto}.pagetext p{margin:0 0 1em}.pagetext span{cursor:pointer}.pagetext span:hover{text-decoration:underline;-webkit-text-decoration-color:var(--rule);text-decoration-color:var(--rule)}.pagetext .here{box-shadow:0 2px 0 var(--mark);background:#e6dcc4}.pagetext .done{color:var(--ink-soft)}.pagetext h3{margin:0 0 .6em;font-size:21px;font-weight:600;line-height:1.35}body[data-mode=page] .pagetext,body[data-mode=phrases] .pagetext,body[data-mode=skim] .pagetext,body[data-mode=train] .pagetext{min-height:360px;max-height:none}.pagetext .para{margin:0 0 1em}.pagetext .phrase{display:block}.pagetext .phrase.end{margin-bottom:.5em}.pagetext.skim span{color:#6b6862}.pagetext.skim mark.key{color:var(--ink);-webkit-box-decoration-break:clone;box-decoration-break:clone;background:#f0e3c2;padding:.05em .2em;font-size:1.2em;font-weight:500}.pagetext.skim mark.key span{color:var(--ink)}.pagetext .gone{color:#0000}.bar{border-top:1px solid var(--rule);grid-template-columns:auto auto auto auto 1fr;align-items:center;display:grid}.bar button{border:none;border-right:1px solid var(--rule);background:0 0;padding:14px 18px}.bar button.main{background:var(--ink);color:var(--sheet);min-width:96px;font-weight:500}.bar .wpm{text-align:right;font-variant-numeric:tabular-nums;color:var(--ink-soft);padding:0 20px}.bar .wpm b{color:var(--ink);font-size:18px;font-weight:600}.bar .pause{font-size:12px;display:block}.track{background:var(--rule);height:3px}.track div{background:var(--ink);width:0;height:100%}.letter{border-top:1px solid var(--rule);color:var(--ink-soft);flex-wrap:wrap;align-items:center;gap:6px 14px;padding:10px 20px;font-size:13px;display:flex}.letter label{cursor:pointer;color:var(--ink);align-items:center;gap:6px;display:inline-flex}.letter .dot{width:10px;height:10px;display:inline-block}.letter .dot.brick{background:var(--brick)}.letter .dot.blue{background:var(--blue)}.about{background:var(--sheet);border:1px solid var(--rule);align-self:start;padding:20px 22px}.about h2{margin:0 0 16px;font-size:17px;font-weight:600}.about dl{margin:0}.about dt{letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);border-top:1px solid var(--rule);padding-top:12px;font-size:12px;font-weight:600}.about dt:first-child{border-top:none;padding-top:0}.about dd{margin:4px 0 12px}@media (width<=900px){.work{grid-template-columns:1fr}}@media (width<=560px){:root{--word:36px}header,nav{padding-left:16px;padding-right:16px}header .load{margin-left:0}.open{padding:16px}.drop{padding:20px 16px 24px}.work{gap:16px;padding:16px}.sheet{min-height:360px}.pagetext{padding:16px;font-size:17px}body[data-mode=sentence] .line{font-size:22px}.gap{background:linear-gradient(var(--ink) 0 18px, transparent 18px calc(100% - 18px), var(--ink) calc(100% - 18px));height:96px;margin-top:-48px}.bar{grid-template-columns:1fr 1fr 1fr 1fr}.bar button{border-bottom:1px solid var(--rule);padding:14px 6px}.bar button:nth-child(4){border-right:none}.bar .wpm{text-align:left;grid-column:1/-1;padding:10px 16px}.bar .pause{margin-left:8px;display:inline}}
