/* 📁НАЧАЛО ФАЙЛА style.css v5.5 */
/* 
 * v5.5: 
 * - Добавлен эффект "отскока" и "свечения" для ВЕРХНЕЙ части страницы
 *   по аналогии с эффектом для нижней части.
*/

/* --- ОСНОВНЫЕ СТИЛИ --- */
html, body {
    height: 100%; margin: 0; padding: 0;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    line-height: 1.4; background-color: #f0f2f5; 
    color: #212529; font-size: 13px;
    position: relative; 
}
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #f0f2f5; border-radius: 50px; }
::-webkit-scrollbar-thumb { background-color: #adb5bd; border-radius: 50px; border: 2px solid #f0f2f5; }
::-webkit-scrollbar-thumb:hover { background-color: #888e93; }
html, body, .sidebar, .content-area,
.codebox .codebox-content pre,
.modal-dynamic-content-placeholder .modal-scrollable-content {
    scrollbar-width: thin;
    scrollbar-color: #adb5bd #f0f2f5;
}
.wrapper { 
    width: 100%; height: 100%; max-width: clamp(900px, 95%, 1350px); 
    margin: 0 auto; background: #ffffff; padding: 8px; 
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.09); display: flex; 
    flex-direction: row; box-sizing: border-box; gap: 8px;
}
.sidebar { 
    display: flex; flex-direction: column; gap: 5px; width: 280px;
    flex-shrink: 0; padding: 12px; background-color: #f8f9fa;
    border: 1px solid #dee2e6; border-radius: 4px; overflow-y: auto; font-size: 0.92em;
}
.sidebar .site-title {
    color: #172b4d; text-align: center; border-bottom: 1px solid #dfe4ea;
    padding-bottom: 10px; margin: 0 0 12px 0; font-size: 1.5em; 
    font-weight: 600; line-height: 1.25;
}
.sidebar h2 {
    margin-top: 0; margin-bottom: 6px; color: #0056b3;
    font-size: 1.2em; text-align: left; border-bottom: 1px solid #e0e0e0; 
    padding-bottom: 4px; font-weight: 600;
}
.sidebar .nav-list { list-style: none; padding: 0; margin: 0; }
.sidebar .nav-list li a {
    display: block; padding: 7px 10px; margin-bottom: 3px; border-radius: 3px; 
    background-color: #fff; border: 1px solid #f1f3f5; color: #343a40; text-decoration: none;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; font-size: 1em;
}
.sidebar .nav-list li a:hover { background-color: #e9ecef; border-color: #d1d5db; color: #0056b3; }
.sidebar .nav-group-heading {
    font-weight: 600; cursor: pointer; padding: 8px 10px; color: #052c65; 
    background-color: #e2e6ea; border: 1px solid #ced4da; border-radius: 3px;
    margin-bottom: 3px; display: flex; justify-content: space-between;
    align-items: center; font-size: 1em;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.sidebar .nav-group-heading:hover { background-color: #d1d5db; border-color: #adb5bd; }
.sidebar .nav-group-heading .toggle-icon {
    font-size: 0.85em; transition: transform 0.3s ease; transform: rotate(0deg); color: #052c65;
}
.sidebar .nav-group.expanded > .nav-group-heading .toggle-icon { transform: rotate(-180deg); }
.sidebar .nav-group-pages { 
    list-style: none; padding-left: 0; margin: 0;
    max-height: 0; overflow: hidden; transition: max-height 0.35s ease-out;
}
.sidebar .nav-group.expanded > .nav-group-pages {
    margin-top: 3px; max-height: 500px; 
}
.sidebar .nav-group-pages li a {
    padding: 6px 10px 6px 18px; background-color: #ffffff;
    border-color: #f1f3f5; font-weight: normal; font-size: 0.95em; 
}
.sidebar .nav-group-pages li a:hover { background-color: #f8f9fa; border-color: #e9ecef; }
.sidebar .highlighted-guide a { background-color: #fff3cd; border-color: #ffeeba; font-weight: 600; }
.sidebar .highlighted-guide a:hover { background-color: #ffe8a1; border-color: #ffda6e; }
.content-area { 
    display: flex; flex-direction: column; gap: 8px;
    overflow-y: auto; flex-grow: 1; padding: 12px; 
    background-color: #ffffff; border: 1px solid #dee2e6; 
    border-radius: 4px;
    position: relative;
}
.content-area h1{color:#172b4d;border-bottom:1px solid #dfe4ea;padding-bottom:10px;margin-top:15px;margin-bottom:15px;font-size:2em;font-weight:600;line-height:1.2}
.content-area h2{color:#0056b3;border-bottom:1px solid #e0e0e0;padding-bottom:6px;margin:1.6em 0 .9em 0;font-size:1.6em;font-weight:600}
.content-area h3{color:#0056b3;border-bottom:1px solid #e9ecef;padding-bottom:5px;margin:1.3em 0 .7em 0;font-size:1.35em;font-weight:600}
.content-area p{margin-bottom:1em;line-height:1.5}
.content-area ul, .content-area ol { padding-left: 20px; margin-bottom: 1em; }
.content-area li { margin-bottom: 0.5em; }
.content-area a{color:#0056b3;text-decoration:none}
.content-area a:hover{text-decoration:underline;color:#003f80}
.content-area a:visited{color:#004c99}
.content-area pre{background-color:#f8f9fa;border:1px solid #dee2e6;border-radius:3px;padding:10px;overflow-x:auto;margin:.8em 0;font-size:.9em;line-height:1.3}
.content-area code{font-family:'Courier New',Courier,monospace;font-size:.9em;background-color:#e9ecef;padding:1px 3px;border-radius:2px;color:#0056b3}
.content-area pre code{display:block;padding:0;background-color:transparent;font-size:1em;color:inherit}
.content-area .note-block,.content-area .info-block,.content-area .warning-block{padding:8px 12px;margin:1em 0;border-radius:3px;border:1px solid #ced4da;background-color:#f8f9fa;border-left-width:3px;font-size:.95em}
.content-area .note-block{border-left-color:#0056b3;color:#004085}
.content-area .info-block{border-left-color:#17a2b8;color:#0c5460}
.content-area .warning-block{border-left-color:#ffc107;color:#856404;background-color:#fff9e6}
.content-area .breadcrumbs{display:flex;justify-content:space-between;align-items:center;font-size:.95em;color:#495057;margin:-12px -12px 15px -12px;padding:8px 12px;background-color:#f8f9fa;border-radius:3px 3px 0 0}
.content-area .breadcrumbs>div:first-child{flex-grow:1}
.content-area .breadcrumbs a{color:#0056b3}
.content-area .breadcrumbs a:hover{text-decoration:underline}
.content-area .breadcrumbs span{margin:0 5px;color:#adb5bd}
.content-area .back-link{display:block;margin-top:40px;text-align:center;font-size:.9em;color:#495057;padding-top:10px;border-top:1px solid #dfe4ea}
.code-block-wrapper,.multi-command-block{margin-bottom:1em;border:1px solid #ced4da;border-radius:3px}
.code-block-wrapper .code-block-header,.multi-command-block-header,.single-command-header{display:flex;justify-content:flex-start;align-items:center;background-color:#e9ecef;padding:4px 8px;font-size:.8em;color:#495057;gap:8px}
.code-block-wrapper .code-block-header,.multi-command-block-header{border-bottom:1px solid #ced4da;border-top-left-radius:2px;border-top-right-radius:2px}
.single-command-header{background-color:#f8f9fa;font-size:.75em}
.single-command-container:not(:first-child) .single-command-header{border-top:1px dashed #ced4da}
.multi-command-block-header{font-weight:600}
.copy-code-button-header{order:-1;padding:2px 6px;background-color:#fff;border:1px solid #adb5bd;border-radius:2px;cursor:pointer;font-size:.9em;color:#495057;transition:background-color .2s,border-color .2s;flex-shrink:0}
.code-block-line-count{font-family:'SFMono-Regular',Consolas,monospace;margin-left:auto;color:#6c757d}
.multi-command-block.code-type-shell .single-command-container .code-block-content pre{background-color:#2c3034;color:#f8f9fa;margin:0;padding:8px 10px;border-top:none}
.code-deleted{color:#721c24!important;background-color:#fdd!important}
.code-added{color:#155724!important;background-color:#d4edda!important;font-weight:bold}
.code-modified{color:#004085!important;background-color:#cce5ff!important}
#download-buttons-container{opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity .3s ease,transform .3s ease,visibility 0s .3s;margin-left:auto;padding-left:20px;flex-shrink:0}
#download-buttons-container.visible{opacity:1;visibility:visible;transform:translateY(0);transition-delay:0s}
#download-buttons-container button{background-color:#e9ecef;color:#212529;border:1px solid #ced4da;padding:4px 10px;font-size:.85em;border-radius:2px;margin-left:5px;cursor:pointer;transition:background-color .2s ease,color .2s ease,border-color .2s ease; display: inline-flex; align-items: center; gap: 6px;}
#download-buttons-container button:hover{background-color:#d1d5db;border-color:#adb5bd}
@media (max-width:768px){.wrapper{flex-direction:column}.sidebar{width:100%;max-height:clamp(100px,25vh,180px)}.sidebar.sidebar-hidden-mobile{max-height:0!important;opacity:0!important;overflow:hidden!important;padding:0!important;box-shadow:none!important;border-bottom-color:transparent!important}}
.codebox{background-color:#fdf6e3;border:1px solid #eee8d5;border-radius:4px;margin:1.5em 0;position:relative;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.codebox-toolbar{background-color:#f8f9fa;border-bottom:1px solid #dee2e6;padding:6px 10px;display:flex;justify-content:flex-start;align-items:center;border-top-left-radius:3px;border-top-right-radius:3px;gap:8px}
.codebox-toolbar button{background-color:#e9ecef;color:#212529;border:1px solid #ced4da;padding:4px 10px;font-size:.8em;border-radius:3px;cursor:pointer;transition:background-color .2s ease,color .2s ease,border-color .2s ease;flex-shrink:0}
.codebox-toolbar button:hover{background-color:#d0d9e2;color:#0056b3;border-color:#adb5bd}
.codebox-toolbar button:disabled{background-color:#e9ecef;color:#6c757d;cursor:not-allowed;opacity:.7}
.codebox-toolbar .codebox-linenum-btn{margin-left:auto}
.codebox .codebox-content pre{margin:0;border:none;border-radius:0;background-color:transparent;padding:12px;color:#586e75;font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,Courier,monospace;font-size:.9em;line-height:1.5;overflow-x:auto;white-space:pre}
.codebox .codebox-content pre.line-numbers-active .codebox-line::before{counter-increment:linenumber;content:counter(linenumber);position:absolute;left:0;top:0;width:35px;padding-right:10px;color:#93a1a1;text-align:right;font-size:.9em;user-select:none;border-right:1px solid #eee8d5}
.codebox .codebox-line.line-added{background-color:rgba(220,255,220,.7)}
.codebox .codebox-line.line-removed{background-color:rgba(255,220,220,.7)}
.codebox .codebox-line.line-modified{background-color:rgba(255,240,200,.7)}
.sidebar .nav-group.has-active > .nav-group-heading { background-color: #cfe2ff; color: #052c65; border-color: #9ec5fe; font-weight: 600; }
.sidebar .nav-group.has-active > .nav-group-heading .toggle-icon { color: #052c65; }
.sidebar .nav-group-pages li.active > a,
.sidebar .nav-group-pages li.active > a:hover,
.sidebar .nav-group-pages li.active > a:visited { background-color: #fff9e6; color: #856404; border-color: #ffc107; font-weight: 600; }
.sidebar .nav-list > li.active > a { background-color: #cfe2ff; color: #052c65; font-weight: bold; border-color: #9ec5fe; }


/* === ИЗМЕНЕНИЯ И ДОБАВЛЕНИЯ === */

/* 1. Кнопки скролла */
.scroll-button { 
    position: absolute; right: 25px; 
    width: 40px; height: 40px;
    background-color: #e2e6ea;
    color: #495057;
    border: 1px solid #ced4da;
    border-radius: 3px;
    font-size: 1.8em; 
    display: flex; justify-content: center; align-items: center; cursor: pointer;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); 
    z-index: 1000;
    opacity: 0;
    filter: blur(5px);
    visibility: hidden;
    transition: opacity 0.4s ease, filter 0.4s ease, visibility 0s 0.4s, background-color 0.2s, border-color 0.2s;
}
.scroll-button:hover { 
    background-color: #d1d5db; 
    border-color: #adb5bd; 
}
.scroll-button.show { 
    opacity: 1; 
    filter: blur(0);
    visibility: visible;
    transition-delay: 0s;
}
.scroll-to-top { top: 50%; transform: translateY(-55px); }
.scroll-to-bottom { top: 50%; transform: translateY(5px); }
@media (max-width: 1450px) { .scroll-button { display: none; } }

/* 2. Модальное окно */
.modal-overlay{position:fixed;inset:0;background-color:rgba(33,37,41,.75);display:flex;justify-content:center;align-items:center;z-index:2000;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease}
.modal-overlay.modal-visible{opacity:1;visibility:visible}
.modal-content{background:#fff;border-radius:5px;box-shadow:0 5px 15px rgba(0,0,0,.3);max-width:600px;width:90%;max-height:80vh;display:flex;flex-direction:column}
.modal-dynamic-content-placeholder{padding:20px;overflow-y:auto;border-bottom:1px solid #dee2e6}
.modal-title{margin-top:0}
.modal-actions{padding:15px;text-align:center}
#accept-cookie-consent {
    font-weight: bold; cursor: pointer; padding: 10px 25px;
    color: #052c65; background-color: #cfe2ff; border: 1px solid #9ec5fe; 
    border-radius: 3px; transition: all 0.2s ease; font-size: 1em;
}
#accept-cookie-consent:hover { background-color: #b9d7ff; border-color: #86b7f7; }
#accept-cookie-consent:disabled{background-color:#6c757d;border-color:#6c757d;cursor:not-allowed}

/* 3. Анимация конца и НАЧАЛА страницы (ИЗМЕНЕНО) */
@keyframes gentle-bounce-glow-bottom {
  0% { transform: translateY(0); box-shadow: inset 0 0 0 0 transparent; }
  50% { transform: translateY(-4px); box-shadow: inset 0 -40px 40px -40px #fff9e6; }
  100% { transform: translateY(0); box-shadow: inset 0 0 0 0 transparent; }
}
@keyframes gentle-bounce-glow-top {
  0% { transform: translateY(0); box-shadow: inset 0 0 0 0 transparent; }
  50% { transform: translateY(4px); box-shadow: inset 0 40px 40px -40px #fff9e6; }
  100% { transform: translateY(0); box-shadow: inset 0 0 0 0 transparent; }
}
.scroll-end-indicator {
    animation: gentle-bounce-glow-bottom 0.8s ease-out;
}
.scroll-start-indicator {
    animation: gentle-bounce-glow-top 0.8s ease-out;
}
/* 📁КОНЕЦ ФАЙЛА style.css v5.5 */