jnfilter @ ce393def946fd8dc51c2b9ce0e4bb86c84b22dda

  1<style type="text/css">
  2:root {
  3    --b-font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  4    --b-font-mono: Consolas, Monaco, monospace;
  5    --b-txt: #2e3440;
  6    --b-bg-1: #fff;
  7    --b-bg-2: #eceff4;
  8    --b-line: #eceff4;
  9    --b-link: #bf616a;
 10    --b-btn-bg: #242933;
 11    --b-btn-txt: #fff;
 12    --b-focus: #88c0d0
 13}
 14
 15@media (prefers-color-scheme: dark) {
 16    :root {
 17        --b-txt: #eceff4;
 18        --b-bg-1: #2e3440;
 19        --b-bg-2: #3b4252;
 20        --b-line: #3b4252
 21    }
 22}
 23
 24*, :after, :before {
 25    box-sizing: border-box
 26}
 27
 28html:focus-within {
 29    scroll-behavior: smooth
 30}
 31
 32body {
 33    max-width: 70ch;
 34    padding: 0 1rem;
 35    margin: auto;
 36    background: var(--b-bg-1);
 37    font-family: var(--b-font-main);
 38    text-rendering: optimizeSpeed;
 39    line-height: 1.5;
 40    color: var(--b-txt);
 41    -moz-tab-size: 4;
 42    tab-size: 4;
 43    word-break: break-word;
 44    -webkit-tap-highlight-color: transparent;
 45    -webkit-text-size-adjust: 100%
 46}
 47
 48address, audio, blockquote, dd, details, dl, fieldset, figure, h1, h2, h3, h4, h5, h6, hr, iframe, ol, p, pre, table, ul, video {
 49    margin: 0 0 1.5rem
 50}
 51
 52h1, h2, h3, h4, h5, h6 {
 53    line-height: 1.25;
 54    margin-top: 2rem
 55}
 56
 57h1 {
 58    font-size: 2rem
 59}
 60
 61h2 {
 62    font-size: 1.5rem
 63}
 64
 65h3 {
 66    font-size: 1.25rem
 67}
 68
 69h4 {
 70    font-size: 1rem
 71}
 72
 73h5 {
 74    font-size: .875rem
 75}
 76
 77h6 {
 78    font-size: .75rem
 79}
 80
 81a {
 82    color: var(--b-link);
 83    text-decoration: none
 84}
 85
 86a:hover {
 87    text-decoration: underline
 88}
 89
 90img, svg, video {
 91    height: auto
 92}
 93
 94embed, iframe, img, object, svg, video {
 95    max-width: 100%
 96}
 97
 98iframe {
 99    border-style: none
100}
101
102abbr[title] {
103    text-decoration: underline;
104    text-decoration: underline dotted
105}
106
107blockquote {
108    margin-left: 0;
109    padding: .5rem 0 .5rem 1.5rem;
110    border-left: .25rem solid var(--b-txt)
111}
112
113blockquote > :last-child {
114    margin-bottom: 0
115}
116
117small {
118    font-size: .875rem
119}
120
121sub, sup {
122    font-size: .75em;
123    line-height: 0;
124    position: relative;
125    vertical-align: baseline
126}
127
128sub {
129    bottom: -.25em
130}
131
132sup {
133    top: -.5em
134}
135
136hr {
137    height: 0;
138    overflow: visible;
139    border: 0;
140    border-bottom: 1px solid var(--b-line)
141}
142
143code, kbd, pre, samp, tt, var {
144    background: var(--b-bg-2);
145    border-radius: .25rem;
146    padding: .125rem .25rem;
147    font-family: var(--b-font-mono);
148    font-size: .875rem
149}
150
151pre {
152    padding: 1rem;
153    border-radius: 0;
154    overflow: auto;
155    white-space: pre
156}
157
158pre code {
159    padding: 0
160}
161
162details {
163    display: block;
164    padding: .5rem 1rem;
165    background: var(--b-bg-2);
166    border: 1px solid var(--b-line);
167    border-radius: .25rem
168}
169
170details > :last-child {
171    margin-bottom: 0
172}
173
174details[open] > summary {
175    margin-bottom: 1.5rem
176}
177
178summary {
179    display: list-item;
180    cursor: pointer;
181    font-weight: 700
182}
183
184summary:focus {
185    box-shadow: none
186}
187
188table {
189    border-collapse: collapse;
190    width: 100%;
191    text-indent: 0
192}
193
194table caption {
195    margin-bottom: .5rem
196}
197
198tr {
199    border-bottom: 1px solid var(--b-line)
200}
201
202td, th {
203    padding: .5rem 0
204}
205
206th {
207    text-align: left
208}
209
210dd, ol, ul {
211    padding-left: 2rem
212}
213
214li > ol, li > ul {
215    margin-bottom: 0
216}
217
218fieldset {
219    padding: .5rem .75rem;
220    border: 1px solid var(--b-line);
221    border-radius: .25rem
222}
223
224legend {
225    padding: 0 .25rem
226}
227
228button, input, select, textarea {
229    margin: 0;
230    padding: .5rem .75rem;
231    max-width: 100%;
232    background: var(--b-bg-2);
233    border: 0;
234    border-radius: .25rem;
235    font: inherit;
236    line-height: 1.125;
237    color: var(--b-txt)
238}
239
240input:not([size]):not([type=button i]):not([type=submit i]):not([type=reset i]):not([type=checkbox i]):not([type=radio i]), select {
241    width: 100%
242}
243
244[type=color i] {
245    min-height: 2.125rem
246}
247
248select:not([multiple]):not([size]) {
249    padding-right: 1.5rem;
250    background-repeat: no-repeat;
251    background-position: right .5rem center;
252    -moz-appearance: none;
253    -webkit-appearance: none;
254    appearance: none
255}
256
257textarea {
258    width: 100%;
259    resize: vertical
260}
261
262textarea:not([rows]) {
263    height: 8rem
264}
265
266[type=button i], [type=reset i], [type=submit i], button {
267    -webkit-appearance: button;
268    display: inline-block;
269    text-align: center;
270    white-space: nowrap;
271    background: var(--b-btn-bg);
272    color: var(--b-btn-txt);
273    border: 0;
274    cursor: pointer;
275    transition: opacity .25s
276}
277
278[type=button i]:hover, [type=reset i]:hover, [type=submit i]:hover, button:hover {
279    opacity: .75
280}
281
282[type=button i][disabled], [type=reset i][disabled], [type=submit i][disabled], button[disabled] {
283    opacity: .5
284}
285
286progress {
287    vertical-align: middle
288}
289
290[type=search i] {
291    -webkit-appearance: textfield;
292    outline-offset: -2px
293}
294
295::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
296    height: auto
297}
298
299::-webkit-input-placeholder {
300    color: inherit;
301    opacity: .5
302}
303
304::-webkit-search-decoration {
305    -webkit-appearance: none
306}
307
308::-webkit-file-upload-button {
309    -webkit-appearance: button;
310    font: inherit
311}
312
313::-moz-focus-inner {
314    border-style: none;
315    padding: 0
316}
317
318:-moz-focusring {
319    outline: 1px dotted ButtonText
320}
321
322:-moz-ui-invalid {
323    box-shadow: none
324}
325
326[aria-busy=true i] {
327    cursor: progress
328}
329
330[aria-controls] {
331    cursor: pointer
332}
333
334[aria-disabled=true i], [disabled] {
335    cursor: not-allowed
336}
337
338:focus, details:focus-within {
339    outline: none;
340    box-shadow: 0 0 0 2px var(--b-focus)
341}
342
343@media (prefers-reduced-motion: reduce) {
344    html:focus-within {
345        scroll-behavior: auto
346    }
347
348    *, :after, :before {
349        animation-delay: -1ms !important;
350        animation-duration: 1ms !important;
351        animation-iteration-count: 1 !important;
352        background-attachment: scroll !important;
353        scroll-behavior: auto !important;
354        transition-delay: 0 !important;
355        transition-duration: 0 !important
356    }
357}
358
359select:not([multiple]):not([size]) {
360    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%232e3440'%3E%3Cpath d='M5 6l5 5 5-5 2 1-7 7-7-7 2-1z'/%3E%3C/svg%3E")
361}
362
363@media (prefers-color-scheme: dark) {
364    select:not([multiple]):not([size]) {
365        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg' fill='%23eceff4'%3E%3Cpath d='M5 6l5 5 5-5 2 1-7 7-7-7 2-1z'/%3E%3C/svg%3E")
366    }
367}
368
369</style >