.section-astronomie{--section-color:#ffffff;color:var(--section-color)}.section-astronomie a{color:var(--section-color)}.section-astronomie a:hover{color:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);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:var(--text-white);background-color:var(--section-color)}:root{--body-bg-color:#121212;--body-bg-color2:#232323;--body-bg-color3:#1a1a1a;--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;--accent-blue-hover:#2da8f4;--accent-blue-light:#bceeff;--link-blue:#8ab4f8;--accent-orange:#b16a00;--accent-green-bright:#a8ff60;--accent-purple-bright:#e553ff;--accent-pink-bright:#f6a7ff;--accent-rose-light:#ffd8d8;--text-muted:#aaa;--text-muted2:#999;--text-light:#ccc;--text-soft:#bbb;--text-softer:#ddd;--text-softest:#eee;--text-dim:#d0d0d0;--text-white:#fff;--footer-text-muted:#b0b0b0;--text-red:#d44;--text-green:#22cc55;--heading-green:#9fd356;--heading-yellow:#e6c84f;--heading-purple:#da88ff;--heading-pink:#f38c8c;--border-dark:#444;--border-darker:#333;--border-panel:#3a3a3a;--border-muted:#888;--bg-dark:#111;--surface-dark:#222;--surface-overlay:#1a1a1a;--surface-elevated:#2a2a2a;--surface-contrast:#2b2b2b;--surface-accent:#2d3a3f;--surface-muted:#333;--surface-elevated-hover:#3a3a3a;--shadow-color:#000000;--scrollbar-thumb:#555;--transparent:rgba(0, 0, 0, 0);--bg-white-00:rgba(255, 255, 255, 0);--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-white-05:rgba(255, 255, 255, 0.05);--bg-white-06:rgba(255, 255, 255, 0.06);--bg-white-10:rgba(255, 255, 255, 0.1);--bg-white-12:rgba(255, 255, 255, 0.12);--bg-white-15:rgba(255, 255, 255, 0.15);--bg-white-20:rgba(255, 255, 255, 0.2);--bg-white-25:rgba(255, 255, 255, 0.25);--accent-blue-alpha-20:rgba(138, 180, 248, 0.2);--accent-blue-alpha-40:rgba(138, 180, 248, 0.4);--accent-blue-glow:rgba(200, 240, 255, 0.18);--bg-red-01:rgba(255, 0, 0, 0.1);--bg-green-01:rgba(0, 255, 0, 0.1);--bg-green-02:rgba(0, 255, 0, 0.2);--bg-lime-005:rgba(0, 255, 100, 0.05);--bg-lime-01:rgba(0, 255, 100, 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);--overlay-black-30:rgba(0, 0, 0, 0.3);--overlay-black-40:rgba(0, 0, 0, 0.4);--overlay-black-50:rgba(0, 0, 0, 0.5);--overlay-black-60:rgba(0, 0, 0, 0.6);--overlay-black-70:rgba(0, 0, 0, 0.7);--overlay-black-75:rgba(0, 0, 0, 0.75);--overlay-black-80:rgba(0, 0, 0, 0.8);--surface-panel-strong:rgba(30, 30, 30, 1);--surface-charcoal-90:rgba(15, 15, 15, 0.9);--surface-charcoal:rgba(15, 15, 15, 1);--surface-onyx-95:rgba(1, 1, 1, 0.95);--surface-onyx:rgba(1, 1, 1, 1);--header-metal-stripe-strong:hsla(0, 0%, 28%, 0.02);--header-metal-stripe-highlight:hsla(0, 0%, 32%, 0.04);--header-metal-stripe-soft:hsla(0, 0%, 22%, 0.01);--header-metal-stripe-soft-highlight:hsla(0, 0%, 26%, 0.03);--header-metal-gradient-top:hsl(0, 0%, 18%);--header-metal-gradient-mid:hsl(0, 0%, 22%);--header-metal-gradient-bottom:hsl(0, 0%, 16%)}*,*::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:var(--body-bg-color)linear-gradient( to bottom,var(--body-bg-color2) 0%,var(--body-bg-color3) 50%,var(--body-bg-color) 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(var(--bg-white-02) 1px,var(--transparent) 1px),linear-gradient(90deg,var(--bg-white-02) 1px,var(--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,var(--surface-charcoal),var(--surface-onyx));border-radius:2rem 2rem 0 0;box-shadow:0 8px 20px var(--overlay-black-60);text-align:center;color:var(--text-dim);border-top:2px solid var(--bg-white-20);p { font-size: 0.85rem; color: var(--text-muted2); margin-top: 1rem; text-align: center; a { color: var(--link-blue); &:hover { color: var(--text-white); } } } nav { margin-bottom: 1.5rem; a { color: var(--link-blue); text-decoration: none; font-weight: 600; transition: color 0.3s ease-in-out, background 0.2s; white-space: nowrap; &:hover { color: var(--text-white); background: var(--accent-blue-alpha-20); 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 var(--bg-white-15); list-style: none; padding-left: 0; gap: 0.3rem; li { padding: 0.2rem 0; font-size: 0.9rem; color: var(--footer-text-muted); } } } } 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,var(--surface-charcoal-90),var(--surface-onyx-95));border:1px solid var(--bg-white-10);border-top:2px solid var(--bg-white-20);box-shadow:0 6px 14px var(--overlay-black-50);color:inherit;text-decoration:none;transition:box-shadow .2s ease-in-out}.article-card:hover{box-shadow:0 8px 18px var(--overlay-black-70)}.article-image{height:180px;background-size:cover;background-position:50%;position:relative;border-bottom:2px solid var(--bg-white-10);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,var(--bg-white-05),var(--transparent));opacity:.4}.article-date{position:absolute;top:160px;left:0;background:var(--accent-orange);color:var(--text-white);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:var(--link-blue)}.article-meta{font-size:.8rem;color:var(--text-soft);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,var(--bg-white-12) 0%,var(--transparent) 60%),linear-gradient(to bottom,var(--surface-charcoal),var(--surface-onyx));border-radius:0 0 2rem 2rem;box-shadow:0 8px 20px var(--overlay-black-60);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: var(--text-white); } .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:var(--surface-elevated);background-image:repeating-linear-gradient(to right,var(--header-metal-stripe-strong) 0%,var(--header-metal-stripe-strong) 4%,var(--header-metal-stripe-highlight) 5%,var(--header-metal-stripe-strong) 6%),repeating-linear-gradient(to right,var(--header-metal-stripe-soft) 0%,var(--header-metal-stripe-soft) 2%,var(--header-metal-stripe-soft-highlight) 3%,var(--header-metal-stripe-soft) 4%),linear-gradient(to bottom,var(--header-metal-gradient-top) 0%,var(--header-metal-gradient-mid) 47%,var(--header-metal-gradient-top) 53%,var(--header-metal-gradient-bottom) 100%);background-size:200px 100%;background-repeat:repeat;border-radius:0 0 1rem 1rem;box-shadow:0 4px 12px var(--overlay-black-50);overflow:hidden;.tablet-links { display: flex; flex-wrap: wrap; gap: .5rem; .tablet-link { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.4rem 0.8rem; border-radius: 999px; background: var(--surface-elevated); color: var(--text-light); text-decoration: none; border: 1px solid var(--transparent); font-size: 0.85rem; line-height: 1; transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease; } .tablet-link:hover, .tablet-link:focus-visible { background-color: var(--surface-elevated-hover); color: var(--text-white); } .tablet-link:focus-visible { outline: 2px solid var(--accent-blue); outline-offset: 3px; border-color: var(--transparent); } .tablet-link:focus:not(:focus-visible) { outline: none; } .tablet-link-icon { font-size: 1rem; line-height: 1; } .tablet-menu { position: relative; display: inline-flex; flex-direction: column; align-items: stretch; } .tablet-menu[open] .tablet-link { background-color: var(--border-dark); color: var(--text-white); } .tablet-menu summary { list-style: none; cursor: pointer; } .tablet-menu summary::-webkit-details-marker, .tablet-menu summary::marker { display: none; } } .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: var(--text-dim); 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: var(--surface-elevated); border: 1px solid var(--border-panel); border-radius: 0.5rem; box-shadow: 0 0 10px var(--overlay-black-40); overflow: auto; padding: 1rem; scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb) var(--surface-elevated); } #TableOfContents ul { list-style: none; padding-left: 1rem; } #TableOfContents li { margin: 0.25rem 0; } #TableOfContents a { text-decoration: none; color: var(--text-light); transition: color 0.2s ease; display: block; } #TableOfContents a:hover { color: var(--accent-blue); text-decoration: underline; } }}.pagination-bar{display:flex;justify-content:space-between;align-items:center;padding:.2rem .3rem;background:linear-gradient(to bottom,var(--surface-charcoal-90),var(--surface-onyx-95));border-top:2px solid var(--bg-white-20);border-radius:12px;box-shadow:0 6px 14px var(--overlay-black-50);gap:1rem;flex-wrap:wrap;&.up { margin-top: 2em; } &.down { margin-bottom: 2em; }}.pagination-bar a,.pagination-bar .disabled{color:var(--link-blue);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:var(--text-white);background:var(--accent-blue-alpha-20)}.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: var(--accent-blue-alpha-20); color: var(--text-white); border-color: var(--accent-blue-alpha-40); } } summary { display: block; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; user-select: none; padding: 0.5rem 1rem; background: var(--bg-white-05); border: 1px solid var(--bg-white-20); 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 var(--border-darker); border-radius: 0.5rem; background: var(--bg-dark); box-shadow: 0 1px 1em var(--shadow-color); 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: var(--bg-white-05); color: var(--footer-link-hover-color); } li span.current { color: var(--text-white); font-weight: bold; background-color: var(--bg-white-10); }}.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: var(--text-soft); background: var(--overlay-black-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: var(--surface-panel-strong); border-radius: 12px; box-shadow: 0 8px 24px var(--overlay-black-30), inset 0 1px 2px var(--bg-white-05); border: 1px solid var(--bg-white-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,var(--transparent) 0%,var(--transparent) 100vh,var(--overlay-black-40) 113vh,var(--overlay-black-80) 125vh)}@media(max-width:768px){article .article-content{padding:2rem 0}}article{.article-content { counter-reset: h2; }}.article-content,article aside{a { color: var(--link-blue); text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1.5px; overflow-wrap: break-word; &:hover, &:focus { color: var(--accent-blue); outline: none; } &:focus-visible { outline: 2px solid var(--accent-blue); outline-offset: 3px; } } a.affiliated { color: var(--accent-purple-bright); text-decoration: underline; } a.affiliated:hover, a.affiliated:focus { color: var(--accent-pink-bright); } a.external { color: var(--heading-pink); text-decoration: underline; } a.external:hover, a.external:focus { color: var(--accent-rose-light); } a.active { color: var(--text-white) !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 var(--accent-blue); background-color: var(--bg-white-03); font-size: 0.9em; color: var(--text-light); 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 var(--accent-blue); color: var(--text-light); 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: var(--text-muted2); text-align: right; } } dl { display: grid; grid-template-columns: 40% 60%; row-gap: 0; border: 1px solid var(--border-dark); border-radius: 4px; overflow: hidden; margin: 2em 0; } dt, dd { padding: 0.6em 1em; border-bottom: 1px solid var(--border-dark); } dt { font-weight: bold; color: var(--text-white); border-right: 1px solid var(--border-dark); } dd { color: var(--text-light); line-height: 1.6; } dl dt:nth-of-type(odd), dl dd:nth-of-type(odd) { background-color: var(--surface-dark); } dl dt:nth-of-type(even), dl dd:nth-of-type(even) { background-color: var(--surface-overlay); } del { display: inline; text-decoration: line-through; color: var(--text-red); background-color: var(--bg-red-01); 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 var(--border-muted); background-color: var(--bg-white-03); summary { color: var(--text-muted); &::before { content: "⚠️ "; margin-right: 0.25em; } } &[open] summary { color: var(--text-white); } } &.update { border-left: 4px solid var(--accent-blue); background-color: var(--bg-accent-blue-01); summary { color: var(--accent-blue); &::before { content: "🛈 "; margin-right: 0.25em; } } &[open] summary { color: var(--text-white); } } &.read-more { border: none; background: none; summary { font-weight: normal; color: var(--link-blue); -webkit-text-decoration: underline dotted; text-decoration: underline dotted; &::before { content: "➕ "; margin-right: 0.25em; } &:hover { color: var(--accent-blue); } } summary~p { padding-left: 1.25em; } } } dfn { font-style: italic; font-weight: normal; border-bottom: 1px dashed var(--accent-blue); 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, var(--bg-white-05), var(--overlay-black-70)); box-shadow: inset 0 0 0 1px var(--bg-white-05), 0 0 10px var(--overlay-black-40); -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: var(--text-muted); margin-top: 0.5em; line-height: 1.4; font-style: italic; padding: 0 1em; font-size: 1rem; em { color: var(--text-softest); } } } hr { all: unset; display: block; width: 100%; max-width: 30em; height: 1rem; margin: 4em auto; position: relative; background: radial-gradient(ellipse at center -20px, var(--accent-blue-glow), var(--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 var(--border-muted); border-radius: 0.2em; background-color: var(--transparent); position: relative; cursor: default; &:checked::after { content: "✓"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: var(--accent-blue); font-weight: bold; font-size: 0.85em; line-height: 1; } &:disabled { opacity: 1; } } ins { display: inline; text-decoration: none; font-weight: bold; color: var(--text-green); background-color: var(--bg-green-01); 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: var(--text-muted); background-color: var(--bg-dark); border-radius: 0.3em; box-shadow: 0 0 6px var(--bg-white-25), 0 0 12px var(--bg-white-12), inset 0 0 1px var(--bg-white-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: var(--accent-blue); position: absolute; left: 0; top: 0.1em; } >ul, >ol { margin-top: 0.5em; margin-bottom: 0.5em; } } } ol { list-style: decimal; li::marker { color: var(--heading-green); 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: var(--text-muted); &::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: var(--accent-green-bright); background-color: var(--bg-dark); border-radius: 0.3em; box-shadow: 0 0 1px var(--bg-green-02), inset 0 0 2px var(--bg-white-05); white-space: pre-wrap; } pre samp { display: block; padding: 1em; margin: 2em auto; background-color: var(--bg-dark); color: var(--accent-green-bright); border-radius: 0.5em; box-shadow: 0 0 10px var(--bg-lime-005), inset 0 0 3px var(--bg-lime-01); font-size: 0.8em; max-height: 50vh; overflow: auto; } strong { color: var(--text-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 var(--border-dark); background-color: var(--bg-white-015); border-radius: 0; } thead { background-color: var(--bg-white-04); color: var(--text-white); font-weight: bold; } thead th { padding: 0.75em 1em; border: 1px solid var(--border-dark); text-align: left; white-space: nowrap; background: linear-gradient(to bottom, var(--bg-white-06), var(--overlay-black-40)); } tbody td { padding: 0.75em 1em; border: 1px solid var(--border-dark); vertical-align: top; text-align: left; color: var(--text-light); background-color: var(--transparent); transition: background-color 0.2s; } tbody tr:nth-child(even) td { background-color: var(--bg-white-015); } tbody tr:hover td { background-color: var(--bg-accent-blue-005); } tbody td:hover { background-color: var(--bg-accent-blue-008); } tfoot td { padding: 0.75em 1em; font-style: italic; color: var(--text-muted); background-color: var(--bg-white-02); border: 1px solid var(--border-dark); }}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: var(--accent-blue); 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: var(--heading-green); 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: var(--heading-yellow); 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: var(--heading-purple); 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: var(--heading-pink); 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:var(--text-softest);background:var(--surface-contrast);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:var(--accent-blue-light);background:var(--surface-accent);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:var(--text-light);background:var(--surface-muted);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:var(--text-softer);font-weight:500;display:block}.timeline .day>.list a:hover{color:var(--accent-blue-hover);text-decoration:underline}