@charset "UTF-8";
.highlight .err { color: #e3d2d2; background-color: #a61717; }
.highlight .c { color: #9c9996; }
.highlight .cm { color: #9c9996; }
.highlight .cp { color: #9c9996; }
.highlight .c1 { color: #9c9996; }
.highlight .cs { color: #9c9996; font-style: italic; }
.highlight .gd { color: #e25050; }
.highlight .gd .x { color: #e25050; }
.highlight .ge { font-style: italic; }
.highlight .gh { color: #999999; }
.highlight .gi { color: #3f993f; }
.highlight .gi .x { color: #3f993f; }
.highlight .go { color: #888888; }
.highlight .gp { color: #555555; }
.highlight .gr { color: #aa0000; }
.highlight .gs { font-weight: bold; }
.highlight .gt { color: #aa0000; }
.highlight .gu { color: #aaaaaa; }
.highlight .k { color: #cf222e; }
.highlight .kc { color: #cf222e; }
.highlight .kd { color: #cf222e; }
.highlight .kp { color: #cf222e; }
.highlight .kr { color: #cf222e; }
.highlight .kt { color: #445588; }
.highlight .n { color: #111111; }
.highlight .na { color: #097e39; }
.highlight .nb { color: #cf222e; }
.highlight .bp { color: #999999; }
.highlight .nc { color: #097e39; }
.highlight .ne { color: #990000; }
.highlight .nf { color: #2c7d74; }
.highlight .ni { color: #097e39; }
.highlight .nn { color: #097e39; }
.highlight .no { color: #a61154; }
.highlight .nt { color: #b81e63; }
.highlight .nv { color: #752a75; }
.highlight .vc { color: #752a75; }
.highlight .vg { color: #752a75; }
.highlight .vi { color: #752a75; }
.highlight .o { color: #0842a0; }
.highlight .ow { color: #0842a0; }
.highlight .m { color: #005a99; }
.highlight .mf { color: #005a99; }
.highlight .mh { color: #005a99; }
.highlight .mi { color: #005a99; }
.highlight .il { color: #005a99; }
.highlight .mo { color: #005a99; }
.highlight .s { color: #914d08; }
.highlight .s1 { color: #914d08; }
.highlight .s2 { color: #914d08; }
.highlight .sb { color: #914d08; }
.highlight .sc { color: #914d08; }
.highlight .sd { color: #914d08; }
.highlight .se { color: #914d08; }
.highlight .sh { color: #914d08; }
.highlight .si { color: #914d08; }
.highlight .sr { color: #009926; }
.highlight .ss { color: #0842a0; }
.highlight .sx { color: #914d08; }
.highlight .w { color: #bbbbbb; }
.highlight .lineno, .highlight .gl { color: #9c9996; }
.highlight .hll { background-color: #ffffcc; }

html { font-size: 16px; }

/** Reset some basic elements */
body, h1, h2, h3, h4, h5, h6, p, blockquote, pre, hr, dl, dd, ol, ul, figure { margin: 0; padding: 0; }

/** Basic styling */
body { font: 400 16px/1.5 -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", "Segoe UI Emoji", "Segoe UI Symbol", "Apple Color Emoji", Roboto, Helvetica, Arial, sans-serif; color: #414141; background-color: #fdfdfd; -webkit-text-size-adjust: 100%; -webkit-font-feature-settings: "kern" 1; -moz-font-feature-settings: "kern" 1; -o-font-feature-settings: "kern" 1; font-feature-settings: "kern" 1; font-kerning: normal; display: flex; min-height: 100vh; flex-direction: column; overflow-wrap: break-word; }

/** Set `margin-bottom` to maintain vertical rhythm */
h1, h2, h3, h4, h5, h6, p, blockquote, pre, ul, ol, dl, figure, div.highlight, figure.highlight { margin-bottom: 15px; }

hr { margin-top: 30px; margin-bottom: 30px; }

/** `main` element */
main { display: block; /* Default value of `display` of `main` element is 'inline' in IE 11. */ }

/** Images */
img { max-width: 100%; vertical-align: middle; }

/** Figures */
figure > img { display: block; }

figcaption { font-size: 14px; }

/** Lists */
ul, ol { margin-left: 30px; }

li > ul, li > ol { margin-bottom: 0; }

/** Headings */
h1, h2, h3, h4, h5, h6 { color: #111111; font-weight: 500; }

/** Links */
a { color: #1e69d8; text-decoration: none; }
a:visited { color: #154895; }
a:hover { color: #414141; text-decoration: underline #818181; text-underline-offset: 3px; }
.social-media-list a:hover { text-decoration: none; }
.social-media-list a:hover .username { text-decoration: underline; }

/** Blockquotes */
blockquote { color: #818181; border-left: 4px solid #e7e7e7; padding-left: 15px; font-size: 1.05rem; font-style: italic; }
blockquote > :last-child { margin-bottom: 0; }
blockquote i, blockquote em { font-style: normal; }

/** Code formatting */
pre, code { font-family: "Menlo", "Inconsolata", "Consolas", "Roboto Mono", "Ubuntu Mono", "Liberation Mono", "Courier New", monospace; background-color: #f6f8fa; }
@media screen and (max-width: 600px) { pre, code { font-family: monospace; } }

pre { padding: 8px 12px; font-size: 15px; line-height: 1.4; color: #111111; overflow-x: auto; }
pre > code { display: inline-block; width: 100%; }

div.highlight, figure.highlight { border: 1px solid #e7e7e7; border-radius: 3px; }
div.highlight pre, figure.highlight pre { margin: 0; }
div.highlight table, div.highlight tbody, div.highlight th, div.highlight tr, div.highlight td, figure.highlight table, figure.highlight tbody, figure.highlight th, figure.highlight tr, figure.highlight td { margin: 0; padding: 0; border: 0; }
div.highlight .lineno, div.highlight .gl, figure.highlight .lineno, figure.highlight .gl { text-align: right; }

figure.highlight table { margin: -8px -12px -14px; }
figure.highlight td.gutter { border-right: 1px solid #e7e7e7; }
figure.highlight td.code { width: 100%; }

code.highlighter-rouge { padding: 1px 5px; font-size: 14px; border: 1px solid #e7e7e7; border-radius: 3px; }

/** Wrapper */
.wrapper { max-width: 800px; margin: 0 auto; padding: 0 30px; }
@media screen and (max-width: 600px) { .wrapper { padding-right: 18px; padding-left: 18px; } }

/** Clearfix */
.wrapper:after { content: ""; display: table; clear: both; }

/** Icons */
.orange { color: #f66a0a; }

.grey { color: #828282; }

.svg-icon { width: 1.25em; height: 1.25em; display: inline-block; fill: currentColor; vertical-align: text-bottom; overflow: visible; }

/** Tables */
table { margin-bottom: 30px; width: 100%; text-align: left; color: #3f3f3f; border-collapse: collapse; border: 1px solid #e7e7e7; }
table tr:nth-child(even) { background-color: #f6f6f6; }
table th, table td { padding: 10px 15px; }
table th { background-color: #efefef; border: 1px solid #dfdfdf; }
table td { border: 1px solid #e7e7e7; }
@media screen and (max-width: 800px) { table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; } }

/** Site header */
.site-header { position: relative; width: 100%; min-height: 55.95px; line-height: 54px; background-color: #fdfdfd; border-top: 5px solid #414141; border-bottom: 1px solid #e7e7e7; }

.site-title { font-size: 1.625rem; font-weight: 300; letter-spacing: -1px; margin-bottom: 0; float: left; }
@media screen and (max-width: 600px) { .site-title { padding-right: 45px; } }
.site-title, .site-title:visited { color: #414141; }

.site-nav { float: right; border: none; background-color: inherit; }
.site-nav label[for="nav-trigger"], .site-nav #nav-trigger { display: none; }
.site-nav .nav-item { color: #414141; }
.site-nav .nav-item:not(:last-child) { margin-right: 15px; }
@media screen and (max-width: 600px) { .site-nav { position: absolute; top: 9px; right: 18px; background-color: #fdfdfd; border: 1px solid #e7e7e7; border-radius: 5px; text-align: right; }
  .site-nav label[for="nav-trigger"] { display: block; float: right; width: 36px; height: 36px; cursor: pointer; }
  .site-nav .menu-icon { float: right; width: 36px; height: 26px; line-height: 0; padding-top: 18px; text-align: center; }
  .site-nav .menu-icon::before { font-family: "Font Awesome 7 Free"; font-weight: 900; }
  .site-nav .menu-icon > svg path { fill: #414141; }
  .site-nav #nav-trigger ~ label[for=nav-trigger] .menu-icon::before { content: "\f0c9"; font-size: 1.25em; }
  .site-nav #nav-trigger ~ .nav-items { clear: both; display: none; }
  .site-nav #nav-trigger:checked ~ label[for=nav-trigger] .menu-icon::before { content: "\f00d"; font-size: 1.5em; }
  .site-nav #nav-trigger:checked ~ .nav-items { display: block; padding-bottom: 5px; }
  .site-nav #nav-trigger:checked ~ .nav-items .nav-item { margin-left: 20px; padding: 5px 10px; }
  .site-nav .nav-item { display: block; margin-right: 15px; padding: 5px 0; color: #414141; line-height: 1.5; } }

/** Site footer */
.site-footer { border-top: 1px solid #e7e7e7; padding: 30px 0; }

.footer-heading { font-size: 1.125rem; margin-bottom: 15px; }

.feed-subscribe .svg-icon { padding: 5px 5px 2px 0; }

.contact-list, .social-media-list { list-style: none; margin-left: 0; }

.footer-col-wrapper, .social-links { font-size: 0.9375rem; color: #656565; }

.footer-col { margin-bottom: 15px; }

.footer-col-1, .footer-col-2 { width: calc(50% - (30px / 2)); }

.footer-col-3 { width: calc(100% - (30px / 2)); }

@media screen and (min-width: 800px) { .footer-col-1 { width: calc(35% - (30px / 2)); }
  .footer-col-2 { width: calc(20% - (30px / 2)); }
  .footer-col-3 { width: calc(45% - (30px / 2)); } }
@media screen and (min-width: 600px) { .footer-col-wrapper { display: flex; }
  .footer-col { width: calc(100% - (30px / 2)); padding: 0 15px; }
  .footer-col:first-child { padding-right: 15px; padding-left: 0; }
  .footer-col:last-child { padding-right: 0; padding-left: 15px; } }
/** Page content */
.page-content { padding: 30px 0; flex: 1 0 auto; }

.page-heading { font-size: 2rem; }

.post-list-heading { font-size: 1.75rem; }

.post-list { margin-left: 0; list-style: none; }
.post-list > li { margin-bottom: 30px; }

.post-meta { font-size: 14px; color: #656565; }

.post-link { display: block; font-size: 1.5rem; }

/** Posts */
.post-header { margin-bottom: 30px; padding-bottom: 18px; text-align: center; border-bottom: 1px solid #e7e7e7; }

.post-meta .bullet-divider { padding-inline: 15px; }
.post-meta .meta-label { font-weight: 600; }
.post-meta .force-inline { display: inline; }
.post-meta .force-inline::before { content: "•"; padding-inline: 5px; }
.post-meta .post-authors { margin-top: 3px; }

.post-title, .post-content h1 { margin-bottom: 10px; font-size: 2.625rem; font-weight: 400; letter-spacing: -1px; line-height: 1.15; }
@media screen and (min-width: 800px) { .post-title, .post-content h1 { font-size: 2.625rem; } }

.post-content { margin-bottom: 30px; }
.post-content h1, .post-content h2, .post-content h3, .post-content h4, .post-content h5, .post-content h6 { margin-top: 30px; }
.post-content h2 { font-size: 1.75rem; }
@media screen and (min-width: 800px) { .post-content h2 { font-size: 2rem; } }
.post-content h3 { font-size: 1.375rem; }
@media screen and (min-width: 800px) { .post-content h3 { font-size: 1.625rem; } }
.post-content h4 { font-size: 1.25rem; }
.post-content h5 { font-size: 1.125rem; }
.post-content h6 { font-size: 1.0625rem; }

.comments-disabled-message { text-align: center; font-weight: 300; }

.social-media-list { display: table; margin: 0 auto; }
.social-media-list li { float: left; min-width: 45px; min-height: 45px; text-align: center; margin: 5px 10px 5px 0; }
.social-media-list li:last-of-type { margin-right: 0; }
.social-media-list li a { display: block; padding: 10px 12px; border: 1px solid #e7e7e7; }
.social-media-list li a:hover { border-color: #dadada; }

/** Pagination navbar */
.pagination { display: table; margin: 0 auto; list-style-type: none; }
.pagination li { float: left; margin: 0 3px; min-width: 45px; min-height: 45px; text-align: center; }
.pagination li a { display: block; text-decoration: none; border: 1px solid #e7e7e7; }
.pagination li a:hover { border-color: #dadada; }
.pagination li a, .pagination li div { min-width: 41px; padding: 10px 12px; text-align: center; box-sizing: border-box; }
.pagination li div { border: 1px solid transparent; }
.pagination li div.pager-edge { color: #e7e7e7; border: 1px dashed; }
.pagination li div.current-page { font-weight: bold; }

/** Task-lists */
.task-list { margin-left: 0; padding-left: 18px; }

.task-list-item { list-style-type: none; }
.task-list-item-checkbox { position: relative; margin-right: 9px; margin-left: -15px; appearance: none; border: 8px solid #e7e7e7; vertical-align: text-top; z-index: -1; }
.task-list-item-checkbox::after { position: absolute; top: -8px; left: -3px; width: 4px; height: 10px; content: ""; border: solid transparent; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.task-list-item-checkbox:checked::after { border-color: #414141; }

/** Grid helpers */
@media screen and (min-width: 800px) { .one-half { width: calc(50% - (30px / 2)); } }
:root { --accent: #e07a6a; --accent-700: #c45e4a; --accent-700-hover: #a84838; --background: #fdf6ee; --bg-0: #fdf6ee; --bg-1: #fff9f3; --bg-2: #f5ede3; --bg-3: #ecddd0; --black1: #3d2c24; --blue: #e07a6a; --blue1: #e07a6a; --blueShadow1: rgba(224, 122, 106, 0.35); --brown: #6b4c3b; --cream-warm: #fff9f3; --gradient1: linear-gradient(120deg, #fff9f3 45%, #fce9e6); --gray1: #937468; --gray2: #785a4c; --gray3: #64483a; --gray4: #50372a; --gray5: #412a1e; --gray6: #321e14; --green: #8aaa8c; --green-bg: #eaf1ea; --green1: #8aaa8c; --left-msg-bg: #f5ede3; --lightBlue1: #c45e4a; --login-container-bg: #fff9f3; --msger-send-btn-bg: #e07a6a; --msger-send-btn-hover-bg: #c45e4a; --my-custom-cat: #e07a6a; --my-custom-dog: #eaf1ea; --orange: #d4845a; --panel: #fff9f3; --popup-bg: #fff9f3; --red: #c45e4a; --right-msg-bg: #e07a6a; --rose: #e07a6a; --rose-light: #f2b5ab; --rose-pale: #fce9e6; --sage: #8aaa8c; --sage-light: #b8ceb9; --sage-pale: #eaf1ea; --status-indicator-base-bg: rgba(196, 168, 130, 0.1); --status-indicator-base-border: rgba(196, 168, 130, 0.2); --status-indicator-error-bg: rgba(196, 94, 74, 0.15); --status-indicator-error-border: rgba(196, 94, 74, 0.3); --status-indicator-error-color: #c45e4a; --status-indicator-pending-bg: rgba(212, 132, 90, 0.15); --status-indicator-pending-border: rgba(212, 132, 90, 0.3); --status-indicator-pending-color: #d4845a; --status-indicator-success-bg: rgba(138, 170, 140, 0.15); --status-indicator-success-border: rgba(138, 170, 140, 0.3); --status-indicator-success-color: #8aaa8c; --success-green: #8aaa8c; --surface: #f5ede3; --tan: #c4a882; --tan-light: #e8d9c4; --teal: #8aaa8c; --terracotta: #c45e4a; --text: #3d2c24; --text-main: #3d2c24; --text-muted: #937468; --toggle-btn-bg: #8aaa8c; --toggle-btn-hover-bg: #6a8a6c; --validation-error-color: #c45e4a; --validation-focus-color: #e07a6a; --validation-success-color: #8aaa8c; --warn: #d4845a; --warn-bg: #fce9e6; --white1: #3d2c24; --white2: rgba(61, 44, 36, 0.85); --white3: rgba(61, 44, 36, 0.7); }

:root { --accent: #e07a6a; --accent-700: #c45e4a; --accent-700-hover: #a84838; --background: #fdf6ee; --bg-0: #fdf6ee; --bg-1: #fff9f3; --bg-2: #f5ede3; --bg-3: #ecddd0; --black1: #3d2c24; --blue: #e07a6a; --blue1: #e07a6a; --blueShadow1: rgba(224, 122, 106, 0.35); --brown: #6b4c3b; --cream-warm: #fff9f3; --gradient1: linear-gradient(120deg, #fff9f3 45%, #fce9e6); --gray1: #937468; --gray2: #785a4c; --gray3: #64483a; --gray4: #50372a; --gray5: #412a1e; --gray6: #321e14; --green: #8aaa8c; --green-bg: #eaf1ea; --green1: #8aaa8c; --left-msg-bg: #f5ede3; --lightBlue1: #c45e4a; --login-container-bg: #fff9f3; --msger-send-btn-bg: #e07a6a; --msger-send-btn-hover-bg: #c45e4a; --my-custom-cat: #e07a6a; --my-custom-dog: #eaf1ea; --orange: #d4845a; --panel: #fff9f3; --popup-bg: #fff9f3; --red: #c45e4a; --right-msg-bg: #e07a6a; --rose: #e07a6a; --rose-light: #f2b5ab; --rose-pale: #fce9e6; --sage: #8aaa8c; --sage-light: #b8ceb9; --sage-pale: #eaf1ea; --status-indicator-base-bg: rgba(196, 168, 130, 0.1); --status-indicator-base-border: rgba(196, 168, 130, 0.2); --status-indicator-error-bg: rgba(196, 94, 74, 0.15); --status-indicator-error-border: rgba(196, 94, 74, 0.3); --status-indicator-error-color: #c45e4a; --status-indicator-pending-bg: rgba(212, 132, 90, 0.15); --status-indicator-pending-border: rgba(212, 132, 90, 0.3); --status-indicator-pending-color: #d4845a; --status-indicator-success-bg: rgba(138, 170, 140, 0.15); --status-indicator-success-border: rgba(138, 170, 140, 0.3); --status-indicator-success-color: #8aaa8c; --success-green: #8aaa8c; --surface: #f5ede3; --tan: #c4a882; --tan-light: #e8d9c4; --teal: #8aaa8c; --terracotta: #c45e4a; --text: #3d2c24; --text-main: #3d2c24; --text-muted: #937468; --toggle-btn-bg: #8aaa8c; --toggle-btn-hover-bg: #6a8a6c; --validation-error-color: #c45e4a; --validation-focus-color: #e07a6a; --validation-success-color: #8aaa8c; --warn: #d4845a; --warn-bg: #fce9e6; --white1: #3d2c24; --white2: rgba(61, 44, 36, 0.85); --white3: rgba(61, 44, 36, 0.7); }

:root { --cream: #fdf6ee; --warm-white: #fff9f3; --rose: #e07a6a; --rose-light: #f2b5ab; --rose-pale: #fce9e6; --terracotta: #c45e4a; --sage: #8aaa8c; --sage-light: #b8ceb9; --sage-pale: #eaf1ea; --tan: #c4a882; --tan-light: #e8d9c4; --brown: #6b4c3b; --text-main: #3d2c24; --text-muted: #937468; --border: rgba(196, 168, 130, 0.25); --border-bright: rgba(196, 168, 130, 0.5); --serif: 'Cormorant Garamond', Georgia, serif; --sans: 'Nunito', system-ui, sans-serif; --pref-bg-color: #fdf6ee; --pref-text-color: #3d2c24; --pref-font-family: 'Nunito', system-ui, sans-serif; --pref-font-size: 15px; --pref-accent-color: #e07a6a; --pref-selection-color: #c45e4a; --panel: #fff9f3; --panel-mid: #f5ede3; --ui-bg: rgba(196, 168, 130, 0.08); --ui-border: rgba(196, 168, 130, 0.25); --background: #fdf6ee; --bg-0: #fdf6ee; --bg-1: #fff9f3; --bg-2: #f5ede3; --bg-3: #ecddd0; --accent: #e07a6a; --accent-700: #c45e4a; --text: #3d2c24; --text-muted: #937468; --green-bg: #eaf1ea; --white: #3d2c24; }

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body { background-color: var(--cream) !important; color: var(--text-main) !important; font-family: var(--sans) !important; font-size: 15px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
body::after { content: ''; position: fixed; inset: 0; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E"); pointer-events: none; z-index: 9999; opacity: 0.35; }

h1, h2, h3, h4, h5, h6 { font-family: var(--serif) !important; color: var(--text-main) !important; font-weight: 600; line-height: 1.15; letter-spacing: -0.3px; }

h1 { font-size: clamp(36px, 4vw, 56px); }

h2 { font-size: clamp(28px, 3vw, 42px); }

h3 { font-size: clamp(22px, 2.5vw, 32px); }

h4 { font-size: 20px; }

p { color: var(--text-muted) !important; line-height: 1.75; }

a { color: var(--warm-white); text-decoration: none; transition: color 0.2s; }
a:hover { color: var(--terracotta) !important; }

li, ul, ol { color: var(--text-muted) !important; }

strong { color: var(--text-main); font-weight: 600; }

em { font-style: italic; color: var(--rose); }

body { font-family: var(--sans) !important; }

.page-content { background-color: var(--cream) !important; padding-top: 64px; }
.page-content .wrapper { max-width: 1200px; padding: 0 48px; }
@media (max-width: 768px) { .page-content .wrapper { padding: 0 20px; } }

.site-header { background: rgba(253, 246, 238, 0.92) !important; backdrop-filter: blur(16px); border-bottom: 1px solid var(--border) !important; border-top: none !important; position: fixed !important; top: 0; left: 0; right: 0; height: 64px; z-index: 9000; }
.site-header .wrapper { display: flex; align-items: center; height: 100%; max-width: 100%; padding: 0 48px; }
@media (max-width: 768px) { .site-header .wrapper { padding: 0 20px; } }

.site-title { font-family: var(--serif) !important; font-size: 20px !important; font-weight: 600 !important; color: var(--text-main) !important; letter-spacing: 0.01em; display: flex; align-items: center; gap: 10px; }
.site-title::before { content: '♥'; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; background: var(--rose); color: white; border-radius: 50%; font-size: 14px; }
.site-title:hover { color: var(--rose) !important; }

.site-nav { background-color: transparent !important; margin-left: auto; }
.site-nav .page-link { font-family: var(--sans) !important; font-size: 13px !important; font-weight: 500 !important; color: var(--text-muted) !important; letter-spacing: 0.02em; padding: 6px 14px !important; border-radius: 20px; transition: color 0.2s, background 0.2s; margin-left: 4px !important; }
.site-nav .page-link:hover { color: var(--text-main) !important; background: var(--tan-light); }

#loginArea.page-link { background: var(--rose) !important; color: white !important; border-radius: 20px; font-weight: 600 !important; padding: 7px 20px !important; transition: background 0.2s, transform 0.15s !important; }
#loginArea.page-link:hover { background: var(--terracotta) !important; color: white !important; transform: translateY(-1px); }

.site-nav .menu-icon svg path { fill: var(--text-main) !important; }

.site-footer { background: var(--brown) !important; border-top: 1px solid rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.5) !important; padding: 40px 0 !important; }
.site-footer .wrapper { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
.site-footer p, .site-footer span, .site-footer div, .site-footer li, .site-footer a { color: rgba(255, 255, 255, 0.5) !important; font-size: 13px; }
.site-footer a:hover { color: rgba(255, 255, 255, 0.85) !important; }
.site-footer .footer-col-wrapper { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 20px; width: 100%; }
.site-footer .footer-col h2.footer-heading { font-family: var(--serif) !important; font-size: 16px !important; color: rgba(255, 255, 255, 0.85) !important; font-weight: 600; margin-bottom: 12px; }
.site-footer .footer-col li, .site-footer .footer-col a { color: rgba(255, 255, 255, 0.5) !important; }
.site-footer .footer-col li:hover, .site-footer .footer-col a:hover { color: rgba(255, 255, 255, 0.85) !important; }

.post-list { list-style: none !important; margin: 0; padding: 0; }
.post-list li { background-color: var(--warm-white) !important; border: 1px solid var(--border) !important; border-radius: 16px; margin-bottom: 20px; padding: 24px !important; color: var(--text-muted) !important; transition: transform 0.2s, box-shadow 0.2s; }
.post-list li:hover { transform: translateY(-3px); box-shadow: 0 12px 32px rgba(61, 44, 36, 0.08); }
.post-list li h3 a { font-family: var(--serif); color: var(--text-main) !important; font-size: 22px; }

.post-meta { color: var(--text-muted) !important; font-size: 13px; }

.post-content, .post-header, article.post { background-color: var(--warm-white) !important; border-radius: 16px; padding: 40px; border: 1px solid var(--border); }
@media (max-width: 768px) { .post-content, .post-header, article.post { padding: 20px; } }

.post-title { font-family: var(--serif) !important; color: var(--text-main) !important; }

button, .btn, input[type="submit"] { font-family: var(--sans) !important; cursor: pointer; transition: all 0.2s; }

.btn-primary, .primary, button.primary { background: var(--rose) !important; color: white !important; border: none !important; border-radius: 10px; padding: 12px 24px; font-weight: 600; }
.btn-primary:hover, .primary:hover, button.primary:hover { background: var(--terracotta) !important; transform: translateY(-1px); }

.btn-ghost, .secondary, button.secondary { background: transparent !important; color: var(--text-main) !important; border: 1px solid var(--border-bright) !important; border-radius: 10px; padding: 12px 24px; }
.btn-ghost:hover, .secondary:hover, button.secondary:hover { border-color: var(--tan) !important; background: var(--tan-light) !important; }

input, textarea, select { background-color: var(--cream) !important; color: var(--text-main) !important; border: 1px solid var(--tan-light) !important; border-radius: 10px !important; padding: 12px 14px; font-family: var(--sans) !important; font-size: 14px; filter: none !important; }
input:focus, textarea:focus, select:focus { outline: none; border-color: var(--rose) !important; box-shadow: 0 0 0 3px rgba(224, 122, 106, 0.15); }
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, textarea:-webkit-autofill, textarea:-webkit-autofill:hover, textarea:-webkit-autofill:focus, select:-webkit-autofill, select:-webkit-autofill:hover, select:-webkit-autofill:focus { -webkit-text-fill-color: var(--text-main) !important; -webkit-box-shadow: 0 0 0 1000px var(--cream) inset !important; background-color: var(--cream) !important; }

.card, .panel, .box, .login-card, .signup-card { background-color: var(--warm-white) !important; border: 1px solid var(--border) !important; border-radius: 16px !important; color: var(--text-main) !important; box-shadow: 0 4px 20px rgba(61, 44, 36, 0.06) !important; }

pre, code { background-color: var(--bg-2) !important; color: var(--brown) !important; border: 1px solid var(--border) !important; border-radius: 8px; font-family: 'Menlo', 'Courier New', monospace !important; }

pre { padding: 1rem; overflow-x: auto; }
pre code { background-color: transparent !important; border: none !important; padding: 0; }

table { border-collapse: collapse; width: 100%; background: var(--warm-white); border: 1px solid var(--border); border-radius: 12px; overflow: hidden; }

th { background: var(--rose-pale) !important; color: var(--terracotta) !important; font-family: var(--sans); font-weight: 600; font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; padding: 12px 16px; }

td { color: var(--text-muted) !important; padding: 12px 16px; border-top: 1px solid var(--border); }

tr:hover td { background: rgba(224, 122, 106, 0.04); }

.search-result-preview { background-color: var(--warm-white) !important; color: var(--text-muted) !important; border-bottom-left-radius: 12px; border-bottom-right-radius: 12px; }

.search-result-highlight { color: var(--rose) !important; font-weight: 600 !important; }

.search-results-list-item .search-result-title { background-color: var(--warm-white) !important; color: var(--text-main) !important; border-top-left-radius: 12px; border-top-right-radius: 12px; padding: 10px; }

.loading-container { background-color: rgba(253, 246, 238, 0.9) !important; }

.spinner { border: 8px solid var(--tan-light) !important; border-top: 8px solid var(--rose) !important; }

.badge { background: var(--rose-pale) !important; color: var(--terracotta) !important; border: 1px solid var(--rose-light) !important; border-radius: 20px; padding: 4px 12px; font-size: 11px; font-weight: 600; letter-spacing: 0.06em; }

.backend-status { background: var(--tan-light) !important; border: 1px solid var(--border) !important; }

.status-item { background: var(--warm-white) !important; }
.status-item.success { background: var(--sage-pale) !important; border-color: var(--sage-light) !important; }
.status-item.error { background: var(--rose-pale) !important; border-color: var(--rose-light) !important; }

.slider { background: var(--tan-light) !important; }

input[type="checkbox"]:checked + .slider { background: var(--rose) !important; }

.modal, .modal-overlay { background-color: rgba(61, 44, 36, 0.7) !important; backdrop-filter: blur(8px); }

.modal-content { background-color: var(--warm-white) !important; border: 1px solid var(--border) !important; border-radius: 24px !important; color: var(--text-main) !important; }

.glass, .tintedGlass { backdrop-filter: blur(16px); }

.tintedGlass { background: rgba(253, 246, 238, 0.75) !important; }

.glow, .glowOnHover { background: var(--warm-white) !important; color: var(--text-main) !important; }
.glow:before, .glowOnHover:before { background: linear-gradient(45deg, #e07a6a, #c4a882, #8aaa8c, #f2b5ab, #e8d9c4, #e07a6a) !important; }
.glow:after, .glowOnHover:after { background: var(--warm-white) !important; }

::-webkit-scrollbar { width: 8px; }

::-webkit-scrollbar-track { background: var(--cream); }

::-webkit-scrollbar-thumb { background: var(--tan-light); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--tan); }

@media (max-width: 768px) { .page-content .wrapper { padding: 0 20px; }
  h1 { font-size: 32px; }
  h2 { font-size: 26px; }
  h3 { font-size: 20px; } }
.acs-badge { display: inline-flex; align-items: center; gap: 8px; background: var(--rose-pale); border: 1px solid var(--rose-light); color: var(--terracotta); font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; padding: 6px 16px; border-radius: 20px; }

.acs-heading { font-family: var(--serif); font-size: clamp(42px, 5vw, 72px); font-weight: 600; line-height: 1.1; letter-spacing: -0.5px; color: var(--text-main); }
.acs-heading em { font-style: italic; color: var(--rose); }

.acs-card { background: var(--warm-white); border: 1px solid var(--border); border-radius: 16px; padding: 28px 24px; transition: transform 0.2s, box-shadow 0.2s; }
.acs-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(61, 44, 36, 0.08); }
.acs-card .acs-card-icon { font-size: 28px; margin-bottom: 14px; }
.acs-card .acs-card-title { font-family: var(--serif); font-size: 20px; font-weight: 600; color: var(--text-main); margin-bottom: 8px; }
.acs-card .acs-card-text { font-size: 13px; color: var(--text-muted); line-height: 1.65; }

.acs-stat .stat-num { font-family: var(--serif); font-size: 40px; font-weight: 600; color: var(--rose); line-height: 1; margin-bottom: 4px; }
.acs-stat .stat-label { font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted); }

.site-nav .trigger { display: none; flex-direction: column; position: absolute; right: 0; top: 64px; width: 220px; background: var(--warm-white); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 8px 32px rgba(61, 44, 36, 0.12); z-index: 1000; padding: 8px; }
.site-nav .trigger .page-link { display: block; border-radius: 8px !important; margin: 2px 0 !important; }

.site-nav .nav-trigger:checked ~ label + .trigger, .site-nav .nav-trigger:checked + label + .trigger { display: flex; }

@media (min-width: 600px) { .site-nav .trigger { display: flex !important; position: static; flex-direction: row; background: none; box-shadow: none; border: none; width: auto; padding: 0; border-radius: 0; } }
#loginArea.page-link { opacity: 1; }

#loginArea .dropdown { position: relative; display: inline-block; }

#loginArea .dropbtn { background: var(--rose) !important; color: white !important; border: none !important; border-radius: 20px; padding: 7px 18px 7px 14px; font-family: var(--sans) !important; font-size: 13px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 7px; transition: background 0.2s, transform 0.15s; letter-spacing: 0.01em; box-shadow: 0 2px 10px rgba(224, 122, 106, 0.25); }
#loginArea .dropbtn::before { content: ''; display: inline-block; width: 22px; height: 22px; background: rgba(255, 255, 255, 0.25); border-radius: 50%; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 12c2.7 0 4.8-2.1 4.8-4.8S14.7 2.4 12 2.4 7.2 4.5 7.2 7.2 9.3 12 12 12zm0 2.4c-3.2 0-9.6 1.6-9.6 4.8v2.4h19.2v-2.4c0-3.2-6.4-4.8-9.6-4.8z'/%3E%3C/svg%3E"); background-size: 14px; background-repeat: no-repeat; background-position: center; flex-shrink: 0; }
#loginArea .dropbtn::after { content: '▾'; font-size: 10px; opacity: 0.8; margin-left: 2px; }
#loginArea .dropbtn:hover { background: var(--terracotta) !important; transform: translateY(-1px); }

#loginArea .dropdown-content { position: absolute; right: 0; top: calc(100% + 10px); min-width: 170px; background: var(--warm-white); border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 12px 40px rgba(61, 44, 36, 0.14); padding: 6px; z-index: 9100; animation: dropFadeIn 0.15s ease; }
#loginArea .dropdown-content::before { content: ''; position: absolute; top: -6px; right: 18px; width: 10px; height: 10px; background: var(--warm-white); border-left: 1px solid var(--border); border-top: 1px solid var(--border); transform: rotate(45deg); }
#loginArea .dropdown-content a { display: flex; align-items: center; gap: 9px; padding: 9px 12px; border-radius: 8px; font-size: 13px; font-weight: 500; color: var(--text-main) !important; text-decoration: none; transition: background 0.15s, color 0.15s; }
#loginArea .dropdown-content a:hover { background: var(--rose-pale); color: var(--terracotta) !important; }
#loginArea .dropdown-content a[href*="profile"]::before { content: '⊙'; font-size: 14px; color: var(--text-muted); }
#loginArea .dropdown-content a[href*="logout"]::before { content: '→'; font-size: 14px; color: var(--text-muted); }
#loginArea .dropdown-content .dropdown-divider { height: 1px; background: var(--border); margin: 4px 6px; }
#loginArea .dropdown-content .roles-list { padding: 6px 12px 4px; font-size: 11px; color: var(--text-muted) !important; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; }
#loginArea .dropdown-content hr { border: none; border-top: 1px solid var(--border); margin: 4px 6px; }

@keyframes dropFadeIn { from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); } }
#loginArea .dropdown-content.hidden { display: none; }

#site-logo { height: 36px; vertical-align: middle; margin-right: 10px; border-radius: 50%; }

.site-nav .menu-icon svg path { fill: var(--text-main) !important; }

.site-footer { background: #3d2c24 !important; border-top: 1px solid rgba(255, 255, 255, 0.08); padding: 48px 0 !important; }
.site-footer .wrapper { max-width: 1200px; margin: 0 auto; padding: 0 48px; }
@media (max-width: 768px) { .site-footer .wrapper { padding: 0 20px; } }
.site-footer .footer-links { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; width: 100%; }
.site-footer .footer-previous { justify-self: start; margin-left: 10vw; }
.site-footer .footer-home { justify-self: center; }
.site-footer .footer-next { justify-self: end; margin-right: 10vw; }
.site-footer .footer-col-wrapper { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 32px; margin-bottom: 32px; }
.site-footer .footer-col { flex: 1 1 160px; }
.site-footer .footer-col h2.footer-heading { font-family: 'Cormorant Garamond', Georgia, serif !important; font-size: 16px !important; font-weight: 600 !important; color: rgba(255, 255, 255, 0.85) !important; margin-bottom: 14px; letter-spacing: 0.02em; }
.site-footer .footer-col ul { list-style: none; margin: 0; padding: 0; }
.site-footer .footer-col ul li { margin-bottom: 8px; color: rgba(255, 255, 255, 0.45) !important; }
.site-footer .footer-col a { color: rgba(255, 255, 255, 0.45) !important; font-size: 13px; text-decoration: none; transition: color 0.2s; }
.site-footer .footer-col a:hover { color: rgba(255, 255, 255, 0.85) !important; }
.site-footer .footer-col p, .site-footer .footer-col span { color: rgba(255, 255, 255, 0.45) !important; font-size: 13px; line-height: 1.6; }
.site-footer .footer-bottom { border-top: 1px solid rgba(255, 255, 255, 0.08); padding-top: 24px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; font-size: 12px; color: rgba(255, 255, 255, 0.35) !important; }

:root { --accent: #e07a6a; --accent-700: #c45e4a; --accent-700-hover: #a84838; --background: #fdf6ee; --bg-0: #fdf6ee; --bg-1: #fff9f3; --bg-2: #f5ede3; --bg-3: #ecddd0; --black1: #3d2c24; --blue: #e07a6a; --blue1: #e07a6a; --blueShadow1: rgba(224, 122, 106, 0.35); --brown: #6b4c3b; --cream-warm: #fff9f3; --gradient1: linear-gradient(120deg, #fff9f3 45%, #fce9e6); --gray1: #937468; --gray2: #785a4c; --gray3: #64483a; --gray4: #50372a; --gray5: #412a1e; --gray6: #321e14; --green: #8aaa8c; --green-bg: #eaf1ea; --green1: #8aaa8c; --left-msg-bg: #f5ede3; --lightBlue1: #c45e4a; --login-container-bg: #fff9f3; --msger-send-btn-bg: #e07a6a; --msger-send-btn-hover-bg: #c45e4a; --my-custom-cat: #e07a6a; --my-custom-dog: #eaf1ea; --orange: #d4845a; --panel: #fff9f3; --popup-bg: #fff9f3; --red: #c45e4a; --right-msg-bg: #e07a6a; --rose: #e07a6a; --rose-light: #f2b5ab; --rose-pale: #fce9e6; --sage: #8aaa8c; --sage-light: #b8ceb9; --sage-pale: #eaf1ea; --status-indicator-base-bg: rgba(196, 168, 130, 0.1); --status-indicator-base-border: rgba(196, 168, 130, 0.2); --status-indicator-error-bg: rgba(196, 94, 74, 0.15); --status-indicator-error-border: rgba(196, 94, 74, 0.3); --status-indicator-error-color: #c45e4a; --status-indicator-pending-bg: rgba(212, 132, 90, 0.15); --status-indicator-pending-border: rgba(212, 132, 90, 0.3); --status-indicator-pending-color: #d4845a; --status-indicator-success-bg: rgba(138, 170, 140, 0.15); --status-indicator-success-border: rgba(138, 170, 140, 0.3); --status-indicator-success-color: #8aaa8c; --success-green: #8aaa8c; --surface: #f5ede3; --tan: #c4a882; --tan-light: #e8d9c4; --teal: #8aaa8c; --terracotta: #c45e4a; --text: #3d2c24; --text-main: #3d2c24; --text-muted: #937468; --toggle-btn-bg: #8aaa8c; --toggle-btn-hover-bg: #6a8a6c; --validation-error-color: #c45e4a; --validation-focus-color: #e07a6a; --validation-success-color: #8aaa8c; --warn: #d4845a; --warn-bg: #fce9e6; --white1: #3d2c24; --white2: rgba(61, 44, 36, 0.85); --white3: rgba(61, 44, 36, 0.7); }

.login-container { display: flex; justify-content: space-between; align-items: flex-start; gap: 32px; flex-wrap: nowrap; max-width: 900px; margin: 60px auto; padding: 0 24px; }
@media (max-width: 768px) { .login-container { flex-direction: column; gap: 20px; } }

.login-card, .signup-card { background-color: var(--warm-white) !important; border: 1px solid var(--border) !important; border-radius: 20px !important; padding: 36px 32px; color: var(--text-main) !important; flex: 1 1 calc(50% - 16px); max-width: 48%; box-sizing: border-box; box-shadow: 0 4px 24px rgba(61, 44, 36, 0.08); }
@media (max-width: 768px) { .login-card, .signup-card { flex: 1 1 100%; max-width: 100%; padding: 24px 20px; } }
.login-card h1, .signup-card h1 { font-family: var(--serif) !important; font-size: 32px !important; font-weight: 600 !important; color: var(--text-main) !important; margin-bottom: 8px; }
.login-card hr, .signup-card hr { border: none; border-top: 1px solid var(--border); margin: 20px 0; }
.login-card p, .signup-card p { color: var(--text-muted) !important; font-size: 13px; margin-bottom: 24px; }

.form-group { position: relative; margin-bottom: 18px; }
.form-group label { display: block; font-size: 11px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted) !important; margin-bottom: 6px; }
.form-group input, .form-group textarea, .form-group select { width: 100%; box-sizing: border-box; background-color: var(--cream) !important; color: var(--text-main) !important; border: 1px solid var(--tan-light) !important; border-radius: 10px !important; padding: 12px 14px; font-family: var(--sans) !important; font-size: 14px; transition: border-color 0.2s, box-shadow 0.2s; }
.form-group input:focus, .form-group textarea:focus, .form-group select:focus { outline: none; border-color: var(--rose) !important; box-shadow: 0 0 0 3px rgba(224, 122, 106, 0.15); }
.form-group input.password-match { border-color: var(--sage) !important; box-shadow: 0 0 0 2px rgba(138, 170, 140, 0.2) !important; }
.form-group input.password-mismatch { border-color: var(--rose) !important; box-shadow: 0 0 0 2px rgba(224, 122, 106, 0.2) !important; }

.validation-message { font-size: 12px; margin-top: 4px; min-height: 1.2rem; }
.validation-message.success { color: var(--sage); }
.validation-message.error { color: var(--terracotta); }

.form-group select { color: var(--text-main) !important; background-color: var(--cream) !important; border: 1px solid var(--tan-light) !important; border-radius: 10px !important; padding: 12px 14px; cursor: pointer; }
.form-group select option { color: var(--text-main); background: var(--cream); }
.form-group select option[disabled], .form-group select:invalid { color: var(--text-muted); }

.login-card button, .signup-card button, .login-card input[type="submit"], .signup-card input[type="submit"] { width: 100%; background: var(--rose) !important; color: white !important; border: none !important; border-radius: 10px !important; padding: 14px; font-family: var(--sans) !important; font-size: 14px; font-weight: 600; cursor: pointer; transition: background 0.2s, transform 0.15s; margin-top: 4px; }
.login-card button:hover, .signup-card button:hover, .login-card input[type="submit"]:hover, .signup-card input[type="submit"]:hover { background: var(--terracotta) !important; transform: translateY(-1px); }
.login-card button:disabled, .signup-card button:disabled, .login-card input[type="submit"]:disabled, .signup-card input[type="submit"]:disabled { background: var(--tan-light) !important; color: var(--text-muted) !important; cursor: not-allowed; transform: none; }

.oauth-error { background: var(--rose-pale); color: var(--terracotta); border: 1px solid var(--rose-light); border-radius: 10px; padding: 10px 14px; font-size: 13px; margin: 12px 0; }

.oauth-success { background: var(--sage-pale); color: var(--sage); border: 1px solid var(--sage-light); border-radius: 10px; padding: 10px 14px; font-size: 13px; margin: 12px 0; }

.secondary { background: var(--tan-light) !important; color: var(--text-main) !important; border: 1px solid var(--border) !important; border-radius: 10px; }
.secondary:hover { background: var(--tan) !important; }

.signup-card button:disabled { background: var(--tan-light) !important; color: var(--text-muted) !important; cursor: not-allowed; border: 1px solid var(--border) !important; transition: none; }

.loading-container { background-color: rgba(253, 246, 238, 0.92) !important; backdrop-filter: blur(12px); }

.spinner { border-color: var(--tan-light) !important; border-top-color: var(--rose) !important; }

#loginModal, .modal { background: rgba(61, 44, 36, 0.7) !important; backdrop-filter: blur(8px); }
#loginModal .modal-content, #loginModal .modal-box, .modal .modal-content, .modal .modal-box { background: var(--warm-white) !important; border: 1px solid var(--border) !important; border-radius: 24px !important; color: var(--text-main) !important; box-shadow: 0 32px 80px rgba(61, 44, 36, 0.2); }
#loginModal .close, #loginModal .modal-close, .modal .close, .modal .modal-close { color: var(--text-muted) !important; background: var(--tan-light) !important; border: none !important; border-radius: 50%; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; font-size: 14px; cursor: pointer; transition: all 0.2s; }
#loginModal .close:hover, #loginModal .modal-close:hover, .modal .close:hover, .modal .modal-close:hover { background: var(--rose-pale) !important; color: var(--rose) !important; }
#loginModal h1, #loginModal h2, #loginModal h3, .modal h1, .modal h2, .modal h3 { font-family: var(--serif) !important; color: var(--text-main) !important; }
#loginModal input, .modal input { background: var(--cream) !important; color: var(--text-main) !important; border: 1px solid var(--tan-light) !important; border-radius: 10px !important; }
#loginModal input:focus, .modal input:focus { border-color: var(--rose) !important; }
#loginModal button, .modal button { background: var(--rose) !important; color: white !important; border: none !important; border-radius: 10px !important; }
#loginModal button:hover, .modal button:hover { background: var(--terracotta) !important; }