.section-astronomie{--section-color:#ffffff;color:var(--section-color)}.section-astronomie a{color:var(--section-color)}.section-astronomie a:hover{color:#fff;background-color:var(--section-color)}.section-collections{--section-color:#78909c;color:var(--section-color)}.section-collections a{color:var(--section-color)}.section-collections a:hover{color:#fff;background-color:var(--section-color)}.section-critiques{--section-color:#e55b5b;color:var(--section-color)}.section-critiques a{color:var(--section-color)}.section-critiques a:hover{color:#fff;background-color:var(--section-color)}.section-films{--section-color:#ef5350;color:var(--section-color)}.section-films a{color:var(--section-color)}.section-films a:hover{color:#fff;background-color:var(--section-color)}.section-informatique{--section-color:#26c6da;color:var(--section-color)}.section-informatique a{color:var(--section-color)}.section-informatique a:hover{color:#fff;background-color:var(--section-color)}.section-jeux-video{--section-color:#66bb6a;color:var(--section-color)}.section-jeux-video a{color:var(--section-color)}.section-jeux-video a:hover{color:#fff;background-color:var(--section-color)}.section-lego{--section-color:#e83e81;color:var(--section-color)}.section-lego a{color:var(--section-color)}.section-lego a:hover{color:#fff;background-color:var(--section-color)}.section-liens-interessants{--section-color:#ffca28;color:var(--section-color)}.section-liens-interessants a{color:var(--section-color)}.section-liens-interessants a:hover{color:#fff;background-color:var(--section-color)}.section-livres{--section-color:#997a6f;color:var(--section-color)}.section-livres a{color:var(--section-color)}.section-livres a:hover{color:#fff;background-color:var(--section-color)}.section-matchbox{--section-color:#9c7f76;color:var(--section-color)}.section-matchbox a{color:var(--section-color)}.section-matchbox a:hover{color:#fff;background-color:var(--section-color)}.section-microscopie{--section-color:#42a5f5;color:var(--section-color)}.section-microscopie a{color:var(--section-color)}.section-microscopie a:hover{color:#fff;background-color:var(--section-color)}.section-paleontologie{--section-color:#d4a54d;color:var(--section-color)}.section-paleontologie a{color:var(--section-color)}.section-paleontologie a:hover{color:#fff;background-color:var(--section-color)}.section-philosophie{--section-color:#b753c8;color:var(--section-color)}.section-philosophie a{color:var(--section-color)}.section-philosophie a:hover{color:#fff;background-color:var(--section-color)}.section-prompted{--section-color:#dd6600;color:var(--section-color)}.section-prompted a{color:var(--section-color)}.section-prompted a:hover{color:#fff;background-color:var(--section-color)}.section-schleich{--section-color:#9770db;color:var(--section-color)}.section-schleich a{color:var(--section-color)}.section-schleich a:hover{color:#fff;background-color:var(--section-color)}.section-series{--section-color:#ffa726;color:var(--section-color)}.section-series a{color:var(--section-color)}.section-series a:hover{color:#fff;background-color:var(--section-color)}:root{--body-bg-color:#000000;--body-bg-color2:#232f3b;--body-bg-color3:#232f3b55;--text-color:hsl(213 20% 80%);--footer-bg-color:#000000;--footer-link-color:hsl(213, 20%, 65%);--footer-link-hover-color:hsl(211, 98%, 90%);--accent-blue:#64c7ff;--link-blue:#8ab4f8;--text-muted:#aaa;--text-muted2:#999;--text-light:#ccc;--text-white:#fff;--text-red:#d44;--text-green:#22cc55;--heading-green:#9fd356;--heading-yellow:#e6c84f;--heading-purple:#da88ff;--heading-pink:#f38c8c;--border-dark:#444;--border-muted:#888;--bg-dark:#111;--bg-white-015:rgba(255, 255, 255, 0.015);--bg-white-02:rgba(255, 255, 255, 0.02);--bg-white-03:rgba(255, 255, 255, 0.03);--bg-white-04:rgba(255, 255, 255, 0.04);--bg-red-01:rgba(255, 0, 0, 0.1);--bg-green-01:rgba(0, 255, 0, 0.1);--bg-accent-blue-01:rgba(100, 199, 255, 0.1);--bg-accent-blue-005:rgba(100, 199, 255, 0.05);--bg-accent-blue-008:rgba(100, 199, 255, 0.08)}*,*::before,*::after{box-sizing:border-box;line-height:150%}html{margin:0;padding:0;height:auto}body,h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin:0}body{max-width:100vw;overflow-x:hidden}img,picture,video,canvas,svg{display:block;max-width:100%;height:auto}input,button,textarea,select{font:inherit}html{font-size:125%;-webkit-text-size-adjust:100%}button,details,summary{cursor:pointer}a,button{outline-offset:2px}p{text-align:justify}p+p{margin-top:.75rem}@media(prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}}@font-face{font-family:gowundodum;src:url(/fonts/gowun-dodum.woff2)format('woff2');font-weight:400;font-style:normal}body{font-family:gowundodum,system-ui,sans-serif;color:var(--text-color);font-size:1rem;min-height:100vh;height:auto;background:#121212 linear-gradient(to bottom,#232323 0%,#1a1a1a 50%,#121212 100%);background-size:100% 100%;position:relative;display:flex;flex-direction:column}body::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:linear-gradient(rgba(255,255,255,2%) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,2%) 1px,transparent 1px);background-size:2px 2px;opacity:.5;pointer-events:none}main{flex-grow:1}.external-link::after{content:" ↗";font-size:.85em;display:inline-block;margin-left:.2em;vertical-align:baseline;text-decoration:none}#hero{padding:1rem;display:flex;gap:1rem;align-items:center}@media(max-width:768px){#hero{flex-direction:column;text-align:center}}body>footer{width:90%;z-index:10;max-width:1200px;margin:2rem auto 0;padding:2rem;background:linear-gradient(to bottom,#0f0f0f,#010101);border-radius:2rem 2rem 0 0;box-shadow:0 8px 20px rgba(0,0,0,.6);text-align:center;color:#d0d0d0;border-top:2px solid rgba(255,255,255,.2);p { font-size: 0.85rem; color: #999; margin-top: 1rem; text-align: center; a { color: #8ab4f8; &:hover { color: #fff; } } } nav { margin-bottom: 1.5rem; a { color: #8ab4f8; text-decoration: none; font-weight: 600; transition: color 0.3s ease-in-out, background 0.2s; white-space: nowrap; &:hover { color: #fff; background: rgba(138, 180, 248, 0.2); border-radius: 3px; } } ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 2rem; list-style: none; padding-left: 0; li { position: relative; text-align: center; flex: 1 1 0px; flex-basis: 0; ul { display: flex; flex-direction: column; margin-top: 0.5rem; padding-top: 0.5rem; border-top: 2px solid rgba(255, 255, 255, 0.15); list-style: none; padding-left: 0; gap: 0.3rem; li { padding: 0.2rem 0; font-size: 0.9rem; color: #b0b0b0; } } } } a, span { display: block; padding: 0.5rem 1rem; border-radius: 4px; } }}.articles-list{padding:1rem;position:relative;z-index:5}.articles-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1rem}.article-card{display:flex;flex-direction:column;justify-content:space-between;border-radius:12px;overflow:hidden;position:relative;background:linear-gradient(to bottom,rgba(15,15,15,.9),rgba(1,1,1,.95));border:1px solid rgba(255,255,255,.1);border-top:2px solid rgba(255,255,255,.2);box-shadow:0 6px 14px rgba(0,0,0,.5);color:inherit;text-decoration:none;transition:box-shadow .2s ease-in-out}.article-card:hover{box-shadow:0 8px 18px rgba(0,0,0,.7)}.article-image{height:180px;background-size:cover;background-position:50%;position:relative;border-bottom:2px solid rgba(255,255,255,.1);filter:brightness(.6);transition:filter .2s ease-in-out}.article-card:hover .article-image{filter:brightness(1)}.article-image::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(255,255,255,5%),rgba(255,255,255,0));opacity:.4}.article-date{position:absolute;top:160px;left:0;background:#b16a00;color:#fff;font-weight:700;font-size:.75rem;padding:4px 12px;border-top-right-radius:4px;border-bottom-right-radius:4px;border-left:none}.article-content{display:flex;flex-direction:column;flex-grow:1;padding:.8rem}.article-title{font-size:1rem;margin-bottom:auto;transition:color .2s ease-in-out}.article-card:hover .article-title{color:#8ab4f8}.article-meta{font-size:.8rem;color:#bbb;display:flex;justify-content:space-between;width:100%;margin-top:.5rem}article>header,main>header{position:relative;z-index:10;width:90%;max-width:1200px;margin:0 auto 2rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:.5rem 1rem;background:radial-gradient(circle at top left,rgba(255,255,255,.12) 0%,transparent 60%),linear-gradient(to bottom,#0f0f0f,#010101);border-radius:0 0 2rem 2rem;box-shadow:0 8px 20px rgba(0,0,0,.6);gap:1rem;.site-logo { flex-shrink: 0; margin: auto; } .header-content { flex: 1; min-width: 200px; display: flex; flex-direction: column; justify-content: center; color: #fff; } .page-title { font-size: 1.5rem; margin: 0; font-weight: 600; } .page-meta { font-size: 0.875rem; margin-top: .25rem; opacity: 0.8; display: flex; flex-wrap: wrap; gap: 0.75rem; }}.tablet-header{position:sticky;top:0;z-index:9;display:flex;align-items:center;gap:.75rem;width:85%;max-width:1140px;margin:-4.5rem auto 2rem;padding:.4rem 1rem;height:2.5rem;background-color:#2a2a2a;background-image:repeating-linear-gradient(to right,hsla(0,0%,28%,2%) 0%,hsla(0,0%,28%,2%) 4%,hsla(0,0%,32%,4%) 5%,hsla(0,0%,28%,2%) 6%),repeating-linear-gradient(to right,hsla(0,0%,22%,1%) 0%,hsla(0,0%,22%,1%) 2%,hsla(0,0%,26%,3%) 3%,hsla(0,0%,22%,1%) 4%),linear-gradient(to bottom,#2e2e2e 0%,#383838 47%,#2e2e2e 53%,#292929 100%);background-size:200px 100%;background-repeat:repeat;border-radius:0 0 1rem 1rem;box-shadow:0 4px 12px rgba(0,0,0,.5);overflow:hidden;.tablet-links { display: flex; gap: .5rem; >a, summary { width: 32px; height: 32px; min-width: 32px; min-height: 32px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #2a2a2a; color: #ccc; font-size: 1rem; text-decoration: none; border: none; outline: none; transition: background 0.2s ease, color 0.2s ease; } >a:hover, summary:hover { background-color: #3a3a3a; color: white; } summary { list-style: none; cursor: pointer; padding: 0; margin: 0; } details[open] summary { background-color: #444; color: white; } summary::-webkit-details-marker { display: none; } summary::marker { content: ""; } } .tablet-logo { height: 32px; flex-shrink: 0; } .tablet-title { font-size: 0.9rem; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #d0d0d0; flex: 1; } #toc { position: relative; #TableOfContents { position: fixed; top: 2.5rem; z-index: 8; width: clamp(300px, 50vw, 600px); max-height: 50vh; right: 0; margin: 0 auto; background-color: #2a2a2a; border: 1px solid #3a3a3a; border-radius: 0.5rem; box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); overflow: auto; padding: 1rem; scrollbar-width: thin; scrollbar-color: #555 #2a2a2a; } #TableOfContents ul { list-style: none; padding-left: 1rem; } #TableOfContents li { margin: 0.25rem 0; } #TableOfContents a { text-decoration: none; color: #ccc; transition: color 0.2s ease; display: block; } #TableOfContents a:hover { color: #64c7ff; text-decoration: underline; } }}.pagination-bar{display:flex;justify-content:space-between;align-items:center;padding:.2rem .3rem;background:linear-gradient(to bottom,rgba(15,15,15,.9),rgba(1,1,1,.95));border-top:2px solid rgba(255,255,255,.2);border-radius:12px;box-shadow:0 6px 14px rgba(0,0,0,.5);gap:1rem;flex-wrap:wrap;&.up { margin-top: 2em; } &.down { margin-bottom: 2em; }}.pagination-bar a,.pagination-bar .disabled{color:#8ab4f8;text-decoration:none;padding:.5rem 1rem;border-radius:6px;transition:color .3s ease-in-out,background .2s;white-space:nowrap}.pagination-bar a:hover{color:#fff;background:rgba(138,180,248,.2)}.pagination-bar .disabled{opacity:.4;pointer-events:none}.page-select{position:relative;display:block;color:var(--footer-link-color);text-decoration:none;white-space:nowrap;font-size:1rem;z-index:10;&[open] { summary { background: rgba(138, 180, 248, 0.2); color: #fff; border-color: rgba(138, 180, 248, 0.4); } } summary { display: block; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none; padding: 0.5rem 1rem; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 6px; font-weight: bold; text-align: center; } summary::-webkit-details-marker { display: none; } summary::after { margin-left: 0.5em; font-family: monospace; content: '▶'; } &.down summary~* { top: 2.5em; &[open] { summary::after { font-family: monospace; content: '▼'; } } } &.up summary~* { bottom: 2.5em; &[open] { summary::after { font-family: monospace; content: '▲'; } } } summary~* { position: absolute; border: 1px solid #333; border-radius: 0.5rem; background: #111; box-shadow: 0 1px 1em #000; max-height: 50vh; overflow-y: auto; margin: 0; padding: 0.5rem; list-style: none; min-width: 6rem; z-index: 100; } ul { padding: 0; margin: 0; } li a, li span.current { display: block; padding: 0.4rem 1rem; text-align: center; color: var(--footer-link-color); text-decoration: none; border-radius: 4px; transition: background-color 0.2s, color 0.2s; } li a:hover { background-color: rgba(255, 255, 255, 0.05); color: var(--footer-link-hover-color); } li span.current { color: white; font-weight: bold; background-color: rgba(255, 255, 255, 0.1); }}.pagination-bar.dossier-pagination{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1em;margin:2em 0}.pagination-bar h2{flex:1 1 100%;font-size:1.5em;margin-bottom:.5em;text-align:center}.page-select.dossier-select summary{cursor:pointer;font-weight:700}.page-select.dossier-select ul{margin:.5em 0 0;padding-left:1em;list-style:none}.page-select.dossier-select li{margin:.25em 0}.page-select.dossier-select .current{font-weight:700;text-decoration:underline}.prev-page,.next-page{white-space:nowrap}.disabled{opacity:.4;pointer-events:none}article{.article-hero { width: 100vw; height: 100vh; background-size: cover; background-position: center; background-repeat: no-repeat; z-index: 1; position: fixed; top: 0; &.blurred-cover { filter: blur(4px); } .image-attribution { position: absolute; bottom: 0; right: 0; transform-origin: bottom right; transform: rotate(-90deg) translateX(100%); font-size: 0.75rem; color: #bbb; background: rgba(0, 0, 0, 0.75); padding: 0.4rem 0.6rem; border-radius: 6px 6px 0 0; pointer-events: none; z-index: 7; white-space: nowrap; } } .article-content, aside { position: relative; z-index: 2; max-width: 80ch; margin: 2rem auto; padding: 2rem; background: rgba(30, 30, 30, 1); border-radius: 12px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3), inset 0 1px 2px rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.05); }}#article-backdrop{position:absolute;top:0;overflow:hidden;left:0;width:100vw;height:auto;bottom:0;pointer-events:none;z-index:1;background:linear-gradient(to bottom,transparent 0%,transparent 100vh,rgba(0,0,0,.4) 113vh,rgba(0,0,0,.8) 125vh)}@media(max-width:768px){article .article-content{padding:2rem 0}}article{.article-content { counter-reset: h2; }}.article-content,article aside{a { color: #8ab4f8; text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1.5px; overflow-wrap: break-word; &:hover, &:focus { color: #64c7ff; outline: none; } &:focus-visible { outline: 2px solid #64c7ff; outline-offset: 3px; } } a.affiliated { color: #e553ff; text-decoration: underline; } a.affiliated:hover, a.affiliated:focus { color: #f6a7ff; } a.external { color: #f38c8c; text-decoration: underline; } a.external:hover, a.external:focus { color: #ffd8d8; } a.active { color: #fff !important; } abbr { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; cursor: help; } address { display: block; margin: 2em; padding: 1em 1.5em; border-left: 4px solid #64c7ff; background-color: rgba(255, 255, 255, 0.03); font-size: 0.9em; color: #ccc; font-style: normal; border-radius: 0.5em; line-height: 1.6; } audio { display: block; width: 100%; max-width: 500px; margin: 2em auto; } blockquote { margin: 2em 0; padding-left: 1.5em; border-left: 4px solid #64c7ff; color: #ccc; font-style: italic; font-size: 1.1em; line-height: 1.6; text-align: justify; cite { display: block; margin-top: 1em; font-style: normal; font-size: 0.9em; color: #999; text-align: right; } } dl { display: grid; grid-template-columns: 40% 60%; row-gap: 0; border: 1px solid #444; border-radius: 4px; overflow: hidden; margin: 2em 0; } dt, dd { padding: 0.6em 1em; border-bottom: 1px solid #444; } dt { font-weight: bold; color: #fff; border-right: 1px solid #444; } dd { color: #ccc; line-height: 1.6; } dl dt:nth-of-type(odd), dl dd:nth-of-type(odd) { background-color: #222; } dl dt:nth-of-type(even), dl dd:nth-of-type(even) { background-color: #1a1a1a; } del { display: inline; text-decoration: line-through; color: #d44; background-color: rgba(255, 0, 0, 0.1); padding: 0 0.2em; border-radius: 0.2em; } details { margin: 2em 0; border-radius: 0.5em; overflow: hidden; padding: 1rem; summary { cursor: pointer; padding: 0.5rem 1rem; font-weight: bold; -webkit-user-select: none; -moz-user-select: none; user-select: none; } &.spoiler { border-left: 4px solid #888; background-color: rgba(255, 255, 255, 0.03); summary { color: #aaa; &::before { content: "⚠️ "; margin-right: 0.25em; } } &[open] summary { color: #fff; } } &.update { border-left: 4px solid #64c7ff; background-color: rgba(100, 199, 255, 0.1); summary { color: #64c7ff; &::before { content: "🛈 "; margin-right: 0.25em; } } &[open] summary { color: #fff; } } &.read-more { border: none; background: none; summary { font-weight: normal; color: #8ab4f8; -webkit-text-decoration: underline dotted; text-decoration: underline dotted; &::before { content: "➕ "; margin-right: 0.25em; } &:hover { color: #64c7ff; } } summary~p { padding-left: 1.25em; } } } dfn { font-style: italic; font-weight: normal; border-bottom: 1px dashed #64c7ff; cursor: help; text-decoration: none; } figure { font-size: 0.9em; display: block; margin: 3em auto; padding: 1rem; border-radius: 1em; background: radial-gradient(circle at top left, rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0.7)); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05), 0 0 10px rgba(0, 0, 0, 0.4); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); max-width: 100%; text-align: center; p { text-align: center; } img, video, audio { display: block; max-width: 100%; max-height: 60vh; margin: 0 auto; border-radius: 0.5em; } figcaption { color: #aaa; margin-top: 0.5em; line-height: 1.4; font-style: italic; padding: 0 1em; font-size: 1rem; em { color: #eee; } } } hr { all: unset; display: block; width: 100%; max-width: 30em; height: 1rem; margin: 4em auto; position: relative; background: radial-gradient(ellipse at center -20px, rgba(200, 240, 255, 0.18), transparent 80%); } input[type="checkbox"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; width: 1.1em; height: 1.1em; margin-right: 0.5em; vertical-align: text-bottom; border: 2px solid #888; border-radius: 0.2em; background-color: transparent; position: relative; cursor: default; &:checked::after { content: "✓"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #64c7ff; font-weight: bold; font-size: 0.85em; line-height: 1; } &:disabled { opacity: 1; } } ins { display: inline; text-decoration: none; font-weight: bold; color: #2c5; background-color: rgba(0, 255, 0, 0.1); padding: 0 0.2em; border-radius: 0.2em; } kbd { display: inline-block; padding: 0.2em 0.6em; margin: 0 0.1em; font-family: inherit; font-size: 0.9em; line-height: 1.2; color: #aaa; background-color: #111; border-radius: 0.3em; box-shadow: 0 0 6px rgba(255, 255, 255, 0.25), 0 0 12px rgba(255, 255, 255, 0.12), inset 0 0 1px rgba(255, 255, 255, 0.04); white-space: nowrap; vertical-align: middle; } pre { overflow: scroll; padding: 1em 0; } ul, ol { margin-block: 1em; padding-left: 1.5em; li { margin-block: 0.3em; } li>ul, li>ol { margin-top: 0.5em; margin-bottom: 0.5em; } } ul { list-style: none; padding-left: 1.5em; margin-block: 1em; li { position: relative; margin-block: 0.3em; padding-left: 1em; text-indent: 0; &::before { content: "•"; color: #64c7ff; position: absolute; left: 0; top: 0.1em; } >ul, >ol { margin-top: 0.5em; margin-bottom: 0.5em; } } } ol { list-style: decimal; li::marker { color: #9fd356; font-variant-numeric: tabular-nums; } } p { text-align: justify; margin-block: .5em; } .highlight { font-size: .8rem; pre { padding: 1rem; overflow: auto; max-height: 50vh; border-radius: .5rem; } } q { quotes: "«\00a0" " »" "“" "”"; font-style: italic; color: #aaa; &::before { content: open-quote; } &::after { content: close-quote; } } samp { display: inline-block; padding: 0.3em 0.6em; margin: 0.2em 0.1em; font-family: 'Courier New', monospace; font-size: 0.9em; line-height: 1.4; color: #a8ff60; background-color: #111; border-radius: 0.3em; box-shadow: 0 0 1px rgba(0, 255, 0, 0.2), inset 0 0 2px rgba(255, 255, 255, 0.05); white-space: pre-wrap; } pre samp { display: block; padding: 1em; margin: 2em auto; background-color: #111; color: #a8ff60; border-radius: 0.5em; box-shadow: 0 0 10px rgba(0, 255, 100, 0.05), inset 0 0 3px rgba(0, 255, 100, 0.1); font-size: 0.8em; max-height: 50vh; overflow: auto; } strong { color: white; } sub, sup { font-size: 0.75em; line-height: 1; position: relative; vertical-align: baseline; } sup { top: -0.4em; } sub { bottom: -0.2em; } table { width: 100%; border-collapse: collapse; margin: 3em 0; font-size: 0.95em; line-height: 1.5; border: 1px solid #444; background-color: rgba(255, 255, 255, 0.015); border-radius: 0; } thead { background-color: rgba(255, 255, 255, 0.04); color: #fff; font-weight: bold; } thead th { padding: 0.75em 1em; border: 1px solid #444; text-align: left; white-space: nowrap; background: linear-gradient(to bottom, rgba(255, 255, 255, 0.06), rgba(0, 0, 0, 0.4)); } tbody td { padding: 0.75em 1em; border: 1px solid #444; vertical-align: top; text-align: left; color: #ccc; background-color: transparent; transition: background-color 0.2s; } tbody tr:nth-child(even) td { background-color: rgba(255, 255, 255, 0.015); } tbody tr:hover td { background-color: rgba(100, 199, 255, 0.05); } tbody td:hover { background-color: rgba(100, 199, 255, 0.08); } tfoot td { padding: 0.75em 1em; font-style: italic; color: #aaa; background-color: rgba(255, 255, 255, 0.02); border: 1px solid #444; }}aside{h2::before,h3::before,h4::before,h5::before,h6::before { content:none; }}.numbered-headings{h2 { counter-reset: h3; counter-increment: h2; margin: 2.2em 0 1em; font-size: 1.8em; color: #64c7ff; scroll-margin-top: 4rem; &::before { content: counter(h2) ". "; } } h3 { counter-reset: h4; counter-increment: h3; margin: 2em 0 0.8em; font-size: 1.5em; color: #9fd356; scroll-margin-top: 4rem; &::before { content: counter(h2) "." counter(h3) ". "; } } h4 { counter-reset: h5; counter-increment: h4; margin: 1.8em 0 0.7em; font-size: 1.3em; color: #e6c84f; scroll-margin-top: 4rem; &::before { content: counter(h2) "." counter(h3) "." counter(h4) ". "; } } h5 { counter-reset: h6; counter-increment: h5; margin: 1.6em 0 0.6em; font-size: 1.1em; color: #da88ff; scroll-margin-top: 4rem; &::before { content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) ". "; } } h6 { counter-increment: h6; margin: 1.4em 0 0.5em; font-size: 1em; color: #f38c8c; scroll-margin-top: 4rem; &::before { content: counter(h2) "." counter(h3) "." counter(h4) "." counter(h5) "." counter(h6) ". "; } }}.timeline{display:grid;grid-template-columns:4rem 6rem 3rem 1fr;row-gap:.5rem;-moz-column-gap:.5rem;column-gap:.5rem;max-width:80ch;margin:0 auto}.timeline .year,.timeline .month,.timeline .day,.timeline .list{display:contents}.timeline .year>span{grid-column:1;font-weight:700;color:#eee;background:#2b2b2b;padding:.2rem .5rem;border-radius:.5rem;position:sticky;top:3rem;z-index:3;text-align:center;align-self:start;height:auto;max-height:none}.timeline .month>span{grid-column:2;font-style:italic;color:#bceeff;background:#2d3a3f;padding:.2rem .5rem;border-radius:.5rem;position:sticky;top:3rem;z-index:2;align-self:start;height:auto;max-height:none;text-align:center}.timeline .day>span{grid-column:3;color:#ccc;background:#333;padding:.2rem .5rem;border-radius:.5rem;position:sticky;top:3rem;z-index:1;align-self:start;height:auto;max-height:none;text-align:center}.timeline .day>.list{grid-column:4;display:flex;flex-direction:column;gap:.2rem;padding:.2rem .5rem}.timeline ul{margin:0 !important;li { margin: 0 !important; padding: 0 0 0 1rem !important; }}.timeline .day>.list a{text-decoration:none;color:#ddd;font-weight:500;display:block}.timeline .day>.list a:hover{color:#2da8f4;text-decoration:underline}