:root { --primary: #e74c3c; --primary-dark: #c0392b; --primary-light: #ff6b61; --secondary: #3498db; --secondary-dark: #2980b9; --dark: #2c3e50; --text: #34495e; --text-light: #7f8c8d; --light: #f5f7f8; --white: #ffffff; --border: #b8c4ca; --shadow-sm: 0 1px 2px rgba(0,0,0,0.05); --shadow-md: 0 4px 6px rgba(0,0,0,0.1); --radius-sm: 4px; --radius-md: 8px; --space-xs: 0.25rem; --space-sm: 0.5rem; --space-md: 1rem; --space-lg: 1.5rem; --space-xl: 2rem; --font-size-sm: 0.875rem; --font-size-base: 1rem; --font-size-lg: 1.125rem; --font-size-xl: 1.25rem; --transition: 0.2s ease-in-out; } *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } html { font-size: 16px; scroll-behavior: smooth; } html, body { scroll-padding-top: 100px; } body { background: var(--white); color: var(--text); font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; font-size: var(--font-size-base, 1rem); line-height: 1.6; margin: 0; min-height: 100vh; display: flex; flex-direction: column; } a { color: var(--secondary); text-decoration: none; transition: color var(--transition); } a:hover { color: var(--secondary-dark); text-decoration: underline; } img { border: 0; vertical-align: middle; } h2 { color: var(--dark); font-size: 1.5rem; margin-bottom: var(--space-md); } h3 { color: var(--dark); font-size: 1.25rem; } pre { background-color: var(--light); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: var(--space-md); overflow: auto; font-size: 0.875rem; } #header { background: #2c3e50; border-bottom: 1px solid #1a252f; padding: var(--space-md) var(--space-xl); position: sticky; top: 0; z-index: 1000; display: flex; align-items: center; gap: var(--space-md); box-shadow: var(--shadow-sm); } #header #network { margin-left: auto; } #header h1 { font-size: var(--font-size-lg); margin: 0; display: flex; align-items: center; gap: var(--space-sm); font-weight: 600; } #header h1 a { color: #f0f2f4; text-decoration: none; display: flex; align-items: center; gap: var(--space-sm); } #header h1 a:hover { color: var(--primary-light); text-decoration: none; } #header img { height: 28px; width: auto; } #header #network ul { display: flex; list-style: none; gap: var(--space-lg); margin: 0; padding: 0; } #header #network a { color: #b0bec5; font-weight: 500; font-size: var(--font-size-sm); padding: var(--space-xs) 0; transition: color var(--transition); text-decoration: none; } #header #network a:hover { color: var(--primary); text-decoration: none; } #nav-toggle { display: none; } #nav-burger { display: none; cursor: pointer; font-size: var(--font-size-xl); background: none; color: #f0f2f4; border: 1px solid rgba(255,255,255,0.25); padding: var(--space-xs) var(--space-sm); border-radius: var(--radius-sm); line-height: 1; user-select: none; } #theme-toggle { display: flex; align-items: center; justify-content: center; cursor: pointer; background: none; border: 1px solid rgba(255,255,255,0.25); padding: var(--space-xs) var(--space-sm); border-radius: var(--radius-sm); line-height: 1; width: 34px; height: 34px; color: #f0f2f4; font-size: var(--font-size-xl); } #theme-toggle:hover { background: rgba(255,255,255,0.1); } #block { background: var(--light); border-bottom: 1px solid var(--border); padding: var(--space-xl); } #block .block-content { max-width: 1100px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-xl); align-items: start; } #block .block-info h2 { color: var(--dark); font-size: 1.5rem; margin: 0 0 var(--space-xs); } #block .block-info p { color: var(--text); line-height: 1.6; margin: 0 0 var(--space-md); } #block .block-info p a { color: var(--secondary); } #block .block-info form { margin-top: var(--space-md); } #block .block-info input[type="search"] { width: 100%; padding: 8px 12px; font-size: var(--font-size-base); font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; border: 2px solid var(--border); border-radius: var(--radius-sm); background: var(--white); color: var(--text); } #block .block-nav { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-md); padding: var(--space-lg); box-shadow: var(--shadow-sm); } #block .block-nav h3 { color: var(--dark); font-size: 1.125rem; margin: 0 0 var(--space-md); padding-bottom: var(--space-sm); border-bottom: 2px solid var(--primary); } #block .block-nav ul { list-style: none; margin: 0; padding: 0; } #block .block-nav li { padding: var(--space-sm) 0; border-bottom: 1px solid var(--border); } #block .block-nav li:last-child { border-bottom: none; } #block .block-nav a { color: var(--secondary); text-decoration: none; font-weight: 500; } #block .block-nav a:hover { color: var(--primary); text-decoration: none; } .mirrors { padding: 8px; text-align: center; background: #f1f1f1; border-bottom: 1px solid var(--border); } .mirrors a, .mirrors a::before { display: inline-block; padding: 0 3px; } .mirrors a::before { vertical-align: -4px; } .br::before { content: url(BR.png); } .ch::before { content: url(CH.png); } .cn::before { content: url(CN.png); } .de::before { content: url(DE.png); } .es::before { content: url(ES.png); } .fr::before { content: url(FR.png); } .ir::before { content: url(IR.png); } .it::before { content: url(IT.png); } .pl::before { content: url(PL.png); } .ru::before { content: url(RU.png); } .se::before { content: url(SE.png); } .tw::before { content: url(TW.png); } .ua::before { content: url(UA.png); } .us::before { content: url(US.png); } #content { padding: var(--space-xl); max-width: 1100px; margin: 0 auto; width: 100%; flex: 1; } .section { margin-bottom: var(--space-2xl, 3rem); } .list .lang { margin: 0; text-align: right; padding: 6px; font-size: 0.9rem; color: var(--text-light); } .list table { background-color: var(--light); border: 1px solid var(--border); width: 100%; margin-bottom: 20px; padding: 0; border-spacing: 0; line-height: 1; border-radius: var(--radius-sm); } .list caption { caption-side: bottom; text-align: left; padding: 6px 0; color: var(--text-light); font-size: 0.875rem; } .list thead tr { background-color: #ddd; } .list thead th { border-bottom: 1px solid var(--border); } .list td { text-align: left; } .list td, .list th { padding: 6px 8px; } .list tbody tr:nth-child(odd) { background-color: var(--white); } .list tbody tr:nth-child(even) { background-color: #f0f2f4; } .list td:nth-child(1) { vertical-align: middle; } .list td:nth-child(1)::before { display: inline-block; vertical-align: middle; padding-right: 4px; } .list th:nth-child(3), .list td:nth-child(3) { text-align: right; } .x-bzip::before { content: url(application-x-bzip.png); } .x-gzip::before { content: url(application-x-gzip.png); } .plain::before { content: url(text-plain.png); } .x-bittorrent::before { content: url(application-x-bittorrent.png); } .octet-stream::before { content: url(application-octet-stream.png); } .jpeg::before { content: url(image-jpeg.png); } .png::before { content: url(image-png.png); } .javascript::before { content: url(text-x-javascript.png); } .css::before { content: url(text-css.png); } .dir::before { content: url(folder.png); } .up::before { content: url(go-up.png); } .zip::before { content: url(application-zip.png); } .iso::before { content: url(application-x-cd-image.png); } .krn::before { content: url(application-x-executable.png); } .exe::before { content: url(application-x-ms-dos-executable.png); } .rme::before { content: url(text-x-readme.png); } .log::before { content: url(text-x-changelog.png); } .x-flavor::before { content: url(slitaz-icon.png); } .pkg::before { content: url(package-x-generic.png); } .server::before { content: url(network-server.png); } .locale::before { content: url(preferences-desktop-locale.png); display: inline-block; vertical-align: middle; } .locale2::before { content: url(preferences-desktop-locale2.png); display: inline-block; vertical-align: middle; } #footer { background: var(--light); border-top: 1px solid var(--border); text-align: center; padding: var(--space-xl); color: var(--text-light); font-size: 0.875rem; margin-top: auto; } #footer p { margin: 0 0 var(--space-sm); } #footer a { color: var(--text-light); margin: 0 var(--space-sm); } #footer a:hover { color: var(--secondary); } #footer img { margin-top: var(--space-md); cursor: pointer; } .footer-nav { margin: var(--space-sm) 0; } .footer-social { margin-top: var(--space-md); font-size: 0.8rem; } .year:after { content: "2026"; } @media (max-width: 768px) { #header { flex-wrap: wrap; padding: var(--space-sm) var(--space-md); } #header h1 { font-size: 1.25rem; } #header h1 a { font-size: 1.25rem; } #header #network ul { gap: var(--space-md); flex-wrap: wrap; } #header #network a { font-size: 0.8rem; } #block { padding: var(--space-md); } #block .block-content { grid-template-columns: 1fr; } #content { padding: var(--space-md); } #footer { padding: var(--space-md); } #footer a { display: inline-block; margin: var(--space-xs) var(--space-sm); } } .touch td, .touch th { padding: 8px; } .touch #network a, .touch .block-nav a, .touch .mirrors a, .touch #footer a { display: inline-block; padding: 6px; } .box { margin: 6px 0; padding: 6px; background: #f4f4f4; border: 1px solid var(--border); border-radius: var(--radius-sm); } .hard { white-space: pre; resize: both; } .scroll { max-height: 40ex; } @media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --dark: #f0f0f0; --text: #b8b8b8; --text-light: #787878; --light: #1e1e1e; --white: #141414; --border: #2a2a2a; } :root:not([data-theme="light"]) #header { background: var(--white); border-bottom-color: var(--border); } :root:not([data-theme="light"]) #header h1 a { color: var(--dark); } :root:not([data-theme="light"]) #header h1 a:hover { color: var(--primary); } :root:not([data-theme="light"]) #header #network a { color: var(--text-light); } :root:not([data-theme="light"]) #header #network a:hover { color: var(--primary); } :root:not([data-theme="light"]) #nav-burger { color: var(--dark); border-color: var(--border); } :root:not([data-theme="light"]) #theme-toggle { color: var(--dark); border-color: var(--border); } :root:not([data-theme="light"]) #block { background: var(--light); } :root:not([data-theme="light"]) #block .block-nav { background: var(--white); } :root:not([data-theme="light"]) .mirrors { background: #1e1e1e; } :root:not([data-theme="light"]) .list thead tr { background-color: #2a2a2a; } :root:not([data-theme="light"]) .list tbody tr:nth-child(even) { background-color: #1c1c1c; } :root:not([data-theme="light"]) #footer { background: var(--light); } } html[data-theme="dark"] { --dark: #f0f0f0; --text: #b8b8b8; --text-light: #787878; --light: #1e1e1e; --white: #141414; --border: #2a2a2a; } html[data-theme="dark"] #header { background: var(--white); border-bottom-color: var(--border); } html[data-theme="dark"] #header h1 a { color: var(--dark); } html[data-theme="dark"] #header h1 a:hover { color: var(--primary); } html[data-theme="dark"] #header #network a { color: var(--text-light); } html[data-theme="dark"] #header #network a:hover { color: var(--primary); } html[data-theme="dark"] #nav-burger { color: var(--dark); border-color: var(--border); } html[data-theme="dark"] #theme-toggle { color: var(--dark); border-color: var(--border); } html[data-theme="dark"] #block { background: var(--light); } html[data-theme="dark"] #block .block-nav { background: var(--white); } html[data-theme="dark"] .mirrors { background: #1e1e1e; } html[data-theme="dark"] .list thead tr { background-color: #2a2a2a; } html[data-theme="dark"] .list tbody tr:nth-child(even) { background-color: #1c1c1c; } html[data-theme="dark"] #footer { background: var(--light); }