body {
	/* Fixed navbar is taller after adding the in-nav search row */
	padding-top: 96px;
	padding-bottom: 90px;
}
@media (max-width: 979px) {
	body {
		/* Keep fixed navbar from overlapping content */
		padding-top: 96px;
		padding-bottom: 0px;
	}

	/* Bootstrap 2 responsive turns fixed navbars into static; override */
	.navbar-fixed-top{
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 1030;
	}
}
@media (max-width: 767px) {
	body {
		padding-top: 96px;
		padding-bottom: 0px;
	}
}

/* Navbar: keep "Forside" + socials always visible (Bootstrap 2) */
.navbar-always-visible{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.navbar-left-group{
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.navbar-right-icons{
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 10px;
}

.navbar-always-visible .nav{
	margin-bottom: 0;
}

.navbar-always-visible .nav--always{
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0;
}

/* Ensure pull-right social list doesn't wrap below on desktop */
.navbar-always-visible .nav--social{
	display: flex;
	flex-direction: row;
	align-items: center;
}

/* Quicklinks group (icon-only; labels on hover) */
.navbar-always-visible .nav--quicklinks{
	display: flex;
	flex-direction: row;
	align-items: center;
	padding-right: 10px;
	margin-right: 4px;
	border-right: 1px solid rgba(37, 95, 10, 0.25);
}

.navbar-always-visible .nav--quicklinks .nav-icon-item{
	position: relative;
}

.nav-icon-link{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px 8px;
	text-decoration: none;
	line-height: 1;
}

.nav-icon-link--quick{
	color: #1f6a0d; /* higher contrast green */
}

/* Override global link color for primary navbar text links */
.navbar .nav-icon-link--primary{
	color: rgba(0, 0, 0, 0.62);
	font-weight: 700;
}

.navbar .nav-icon-link--primary:hover,
.navbar .nav-icon-link--primary:focus{
	color: rgba(0, 0, 0, 0.78);
	text-decoration: none;
}

.nav-icon-link--login{
	color: #8a1f1f;
	border: 1px solid rgba(190, 50, 50, 0.65);
	border-radius: 999px;
	padding: 9px 10px;
	background: rgba(190, 50, 50, 0.10);
}

.nav-icon-link--logout{
	color: #0b3a07;
	border: 1px solid rgba(37, 95, 10, 0.35);
	border-radius: 999px;
	padding: 9px 10px;
	background: rgba(0, 0, 0, 0.03);
}

.nav-icon-link--logout:hover,
.nav-icon-link--logout:focus{
	background: rgba(0, 0, 0, 0.06);
	text-decoration: none;
}

.nav-icon-link--quick:hover,
.nav-icon-link--quick:focus{
	color: #0f4b0a;
	text-decoration: none;
}

.nav-icon-link--login:hover,
.nav-icon-link--login:focus{
	background: rgba(190, 50, 50, 0.18);
	color: #6f1515;
	text-decoration: none;
}

.nav-icon-link i{
	font-size: 14px;
}

.nav-icon-link--home{
	gap: 6px;
	padding: 10px 10px;
}

.nav-icon-link--home i{
	font-size: 16px;
}

/* Forside: like login pill, but green + larger icon */
.nav-icon-link--home-green{
	color: #0f4b0a;
	border: 1px solid rgba(37, 95, 10, 0.65);
	border-radius: 999px;
	padding: 9px 11px;
	background: rgba(37, 95, 10, 0.10);
}

.nav-icon-link--home-green:hover,
.nav-icon-link--home-green:focus{
	background: rgba(37, 95, 10, 0.18);
	color: #0b3a07;
	text-decoration: none;
}

.nav-icon-link--home-green i{
	font-size: 21px; /* ~30% larger than 16px */
}

.nav-icon-link__label{
	position: absolute;
	top: 100%;
	right: 0;
	margin-top: 2px;
	padding: 2px 7px;
	border-radius: 999px;
	border: 1px solid rgba(37, 95, 10, 0.35);
	background: rgba(255, 255, 255, 0.98);
	color: #0f4b0a;
	font-size: 11px;
	white-space: nowrap;
	opacity: 0;
	transform: translateY(-2px);
	pointer-events: none;
	transition: opacity 0.12s ease, transform 0.12s ease;
}

.nav-icon-link:hover .nav-icon-link__label,
.nav-icon-link:focus .nav-icon-link__label,
.nav-icon-link:focus-visible .nav-icon-link__label{
	opacity: 1;
	transform: translateY(0);
}

/* Inline label variant (used for "Forside") */
/* (kept for possible future use) */
.nav-icon-link__label--inline{
	position: static;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	opacity: 1;
	transform: none;
	pointer-events: none;
	font-size: 13px;
}

/* Navbar container: consistent horizontal breathing room */
.navbar-fixed-top .navbar-inner .container{
	padding-left: 20px;
	padding-right: 20px;
}

/* Smallest screens: add a bit of breathing room against chrome edges */
@media (max-width: 480px){
	.navbar-fixed-top .navbar-inner .container{
		padding-left: 18px;
		padding-right: 18px;
	}
}

/* Slightly tighter social icons in the always-visible row */
.navbar-always-visible .social-nav-item > a.social-icon{
	padding: 10px 6px;
}

.thumbnails li{
	margin-bottom: 0px;
}

/* Mobile: show 2 thumbnails per row */
@media (max-width: 767px) {
	ul.thumbnails{
		margin-left: 0;
		display: flex;
		flex-wrap: wrap;
	}
	ul.thumbnails > li{
		float: none !important;
		width: 50% !important;
		flex: 0 0 50%;
		margin-left: 0;
		box-sizing: border-box;
		padding-left: 6px;
		padding-right: 6px;
	}
	/* Bootstrap 2 grid spans override width on phones; force 2-up */
	ul.thumbnails > li[class*="span"]{
		float: none !important;
		width: 50% !important;
		flex: 0 0 50%;
	}
	ul.thumbnails > li:nth-child(2n+1){
		clear: none !important;
	}
}

pre.code{
	display:inline-block;
	width: 99%;
	overflow: auto;
	font-size: 8pt;
	color: white;
	max-height: 400px;
}

blockquote{
	background-color: #F7F7F7;
	font-family: monospace;
	font-size: 9pt;
	font-style: italic;
}

.box{
	border:0px solid #8A8A8A;
	border-radius:3px;
	box-shadow: 2px 2px 8px black;;
	background-color:#fff;
	margin-bottom: 15px;
	}
	.box-comment{
		border-radius:3px;
		box-shadow: 0px 0px 2px #000;
		background-color:#fff;
		margin-bottom: 15px;
		margin-right: 15px;
		margin-left: 15px;
		}
.box-header{
	background-color: #fff;
	padding-top: 2px;
	padding-bottom: 2px;
	border-bottom: 1px solid black;
}
	.box-header-comment{
		background-color: #ebebeb;
	}
	.box-header-icon{
		text-align:center;
	}
	.aside-header{
		display:block;
		font-size:10pt;
		font-weight:bold;
		padding:3px 12px 3px 10px;
		color:#000;
	}
.box-content{
	padding: 2px;
	margin: 5px;
}
	.box-content-icon{
		text-align:center;
	}
.date-day{
	display:block;
	color:#000;
	font-size:24pt;
	font-weight: bold;
	line-height:normal;
	text-align:center;
	}



textarea {
	width: 100%;
	height: 400px;
}
textarea.small {
	height: 120px;
}


.norm {
	display: inline-block;
	margin: 3px;
}
.left {
	display: block;
	float: left;
	clear: left;
	margin: 0px 15px 10px 5px;
}
.right {
	display: block;
	float: right;
	clear: right;
	margin: 0px 5px 10px 15px
}

.image_border{
	border:1px solid #000;
	border-radius:3px;
	box-shadow: 2px 2px 2px #AAA;
}


img.tvseries {
	float: left;
	margin: 10px;
	box-shadow: 0 2px 5px #000;
	border: 2px solid white;
}
.scrollable {
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}

/* a.link_self was intentionally empty; removed to avoid empty ruleset warnings */
a.link_blank{
	color: #a24f4f;
	background: transparent url("/static/img/external_link.5f290643d58b.png") no-repeat center left;
	padding-left: 13px;
}

a.menylink{
	color: black;
	text-decoration: none;
}


.blog_archive_body {
	width: 100%;
	display: table;
}

.blog_archive_body ul {
	display: table-row;
	list-style: none;
}
.blog_archive_body li {
	display: inline-block;
	width: 25%;
}
.blog_archive_body p, .blog_archive_body a {
	border-radius: 5px;
	padding: 0px 2px;
	margin: 1px;
	font-size: 7pt;
	text-align: center;
}
.blog_archive_body p {
	border: 1px dotted #ccc;
	color: #ccc;
}
a {
	color: #255f0a;
}

/* Navbar primary links should not inherit global green */
.navbar a.nav-icon-link--primary{
	color: rgba(0, 0, 0, 0.62);
	font-weight: 700;
}

.navbar a.nav-icon-link--primary:hover,
.navbar a.nav-icon-link--primary:focus{
	color: rgba(0, 0, 0, 0.78);
	text-decoration: none;
}

.blog_archive_body a {
	border: 1px solid #255f0a;
	display: block;
	text-decoration: none;
}
.blog_archive_body a:hover, .blog_archive_body .active {
	background: #255f0a;
	color: white;
}

.database_container{
	padding: 5px 0;
}
.database_item {
	margin: 5px;
}
.database_row {
	margin: 10px;
}

.database_tvseries_item {
	margin-bottom: 20px;
	min-height: 120px;
}

.database_tvseries_text{
	margin-left: 125px;
}

.searchbox_length {
	width: 80%;
}

.filePreviewMargin{
	margin:0 10px;
}
.mindmapPreviewMargin{
	margin:0 10px 0 34px;
}
.submitButtonMargin{
	margin-right: 20px;
}

.clearBoth{
	clear:both;
}
.displayInline {
	display: inline;
}
.displayInlineBlock {
	display: inline-block;
}
.width100pct {
	width: 100%;
}
.margin0px{
	margin: 0px;
}
.margin5px{
	margin: 5px;
}
.margin10px{
	margin: 10px;
}

.floatLeft{
	float:left;
}
.textLineThrough{
	text-decoration:line-through;
}
.textJustify{
	text-align: justify;
}

/* Inline <video> is replaced + inline by default; width:100% alone does not cap to parent. */
.textJustify .blog-post-video{
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	box-sizing: border-box;
}

/* BBCode gallery / [img] / [thumb]: fluid images without inline style (strict CSP style-src). */
.textJustify .blog-post-img-fluid{
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	box-sizing: border-box;
}


#image_upload_actions ul{
	list-style: none;
	margin: 0px;
}
#image_upload_actions li{
	display: inline-block;
}

#search-box{
	margin-top: 10px;
	margin-bottom: 10px;
}

#div_message{
	margin-top: 20px;
	margin-bottom: 10px;
}

.text_highlight{
	background: #DCF7B0;
}

.checkbox_active{
	border-color: black;
	background-color: #FFB273;
}

.user_profile{
	padding: 6px;
	overflow: hidden;
	box-shadow: 4px 2px 4px rgba(0, 0, 0, 0.13);
	margin-bottom: 10px;
	border: 1px solid #DDD;
	border-radius: 7px;
}

.log_high{
	color: #EB3C3C;
}

.log_medium{
	color: black;
}

.log_low{
	color: gray;
}

/* Social icons in navbar: keep same line, small like links */
.social-nav-item > a.social-icon{
	display: block;
	padding: 10px 6px; /* matches bootstrap navbar-ish spacing */
	line-height: 20px;
	color: #555;
	text-decoration: none;
	transition: transform 0.2s, color 0.2s;
}

.social-nav-item > a.social-icon svg{
	width: 15px;
	height: 15px;
	display: inline-block;
	vertical-align: text-bottom;
}

.social-nav-item > a.social-icon:hover{
	transform: scale(1.15);
}

/* Brand Colors */
.github:hover { color: #24292e; }
.instagram:hover { color: #E1306C; }
.spotify:hover { color: #1DB954; }
.flickr:hover { color: #0063dc; }
.youtube:hover { color: #FF0000; }
.five-hundred-px:hover { color: #0099e5; }
.facebook:hover { color: #1877F2; }
.rss:hover { color: #f26522; }

/* CSP-safe replacements for inline style="" attributes */
.svg-sprite{
	position: absolute;
	width: 0;
	height: 0;
	overflow: hidden;
}

.navbar-search--tight{
	margin-bottom: 12px;
}

.navbar-search--in-nav{
	float: none;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 6px;
	min-width: 0;
}

.navbar-search--in-nav .search-query--wide{
	width: 250px;
	max-width: 100%;
	min-width: 0;
}

.navbar-search--in-nav .btn-icon-reset{
	padding: 0 6px;
}

.search-query--wide{
	width: 250px;
}

/* Prevent tiny horizontal overflows (iOS Safari) from causing side-scroll */
html, body{
	overflow-x: hidden;
}

@supports (overflow: clip){
	html, body{
		overflow-x: clip;
	}
}

/* Small-screen navbar: allow wrapping instead of overflow */
@media (max-width: 767px){
	.navbar-always-visible{
		flex-wrap: wrap;
	}

	.navbar-left-group{
		flex: 0 0 auto;
		width: auto;
	}

	.navbar-search--in-nav{
		/* Keep Forside + search on same row */
		flex: 1 1 auto;
		width: auto;
		justify-content: flex-end;
		margin-top: 0;
	}

	.navbar-search--in-nav .search-query--wide{
		width: 100%;
	}

	.navbar-right-icons{
		/* Icons drop to next row to avoid crowding */
		flex: 1 0 100%;
		justify-content: space-between;
	}

	/* Bootstrap 2 navbar uses floats; override to wrap safely on narrow screens */
	.navbar .nav-collapse .nav{
		display: flex;
		flex-wrap: wrap;
		float: none;
		margin-right: 0;
	}
	.navbar .nav-collapse .nav > li{
		float: none;
	}

	/* Social icons: keep compact on small screens */
	.social-nav-item > a.social-icon{
		padding: 10px 4px;
	}

	/* Search: never exceed viewport width */
	.navbar-search.pull-right{
		float: none;
	}
	.search-query--wide{
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}
}

/* Front page bottom year slider */
.home-years-spacer{
	/* extra space since bottom nav now includes categories + year + month bars */
	height: 124px;
}

/* Categories bar: center items when they fit */
.home-categories-bar__inner{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	gap: 7px;
	white-space: normal; /* flex handles layout; keep scroll via overflow-x */
}

/* When scroll buttons are shown (scrollable), left-align to avoid collisions */
.home-years-bar--scrollable .home-categories-bar__inner{
	justify-content: flex-start;
}

.home-categories-bar__cat{
	margin-right: 0; /* gap handles spacing */
}

.home-bottom-nav{
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1030;
	background: rgba(255, 255, 255, 0.98);
	border-top: 1px solid #ddd;
	overflow-x: hidden; /* avoid 1-2px indicator overflow causing page scroll */
	box-sizing: border-box;
}

/* Auto-hide top navbar + bottom archive bars after idle scroll (mobile-friendly). */
body.ui-autohide-enabled .navbar-fixed-top,
body.ui-autohide-enabled .home-bottom-nav{
	transition: transform 4000ms cubic-bezier(0.22, 1, 0.36, 1);
	will-change: transform;
}

body.ui-autohide-hidden .navbar-fixed-top{
	transform: translateY(-110%);
}

body.ui-autohide-hidden .home-bottom-nav{
	transform: translateY(110%);
}

/* When lightbox photo viewer is open, never show navs. */
html.lightbox-open body.ui-autohide-enabled .navbar-fixed-top,
html.lightbox-open body.ui-autohide-enabled .home-bottom-nav{
	transform: translateY(110%);
	opacity: 0;
	pointer-events: none;
}

html.lightbox-open body.ui-autohide-enabled .navbar-fixed-top{
	transform: translateY(-110%);
}

.home-bottom-nav__container{
	/* align with main content container width */
	padding-left: 0;
	padding-right: 0;
}

.home-years-bar{
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	gap: 6px;
	min-width: 0;
}

.home-months-bar{
	position: static;
}

/* Same visual language as .home-years-bar__year — compact chevrons, no gradient overlays */
.home-years-bar .home-scroll-btn{
	flex: 0 0 auto;
	display: none;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 3px 9px;
	border: 1px solid #255f0a;
	border-radius: 999px;
	background: transparent;
	color: #255f0a;
	cursor: pointer;
	font-size: 10px;
	line-height: 1;
	opacity: 1;
	pointer-events: none;
	transition: opacity 0.15s ease, background 0.12s ease, color 0.12s ease;
}

.home-years-bar .home-scroll-btn:hover:not(:disabled),
.home-years-bar .home-scroll-btn:focus-visible:not(:disabled){
	background: rgba(37, 95, 10, 0.08);
	outline: none;
}

.home-years-bar--scrollable .home-scroll-btn{
	display: inline-flex;
	pointer-events: auto;
}

/* Mouse / trackpad: tuck away until hover so the row stays calm */
@media (hover: hover) and (pointer: fine){
	.home-years-bar--scrollable:not(:hover):not(:focus-within) .home-scroll-btn:not(:disabled){
		opacity: 0.35;
	}
}

.home-years-bar--scrollable.home-years-bar:hover .home-scroll-btn:not(:disabled),
.home-years-bar--scrollable.home-years-bar:focus-within .home-scroll-btn:not(:disabled){
	opacity: 1;
}

.home-years-bar .home-scroll-btn:disabled{
	opacity: 0.3;
	cursor: default;
	pointer-events: none;
	border-color: #a8c79a;
	color: #7a9a6c;
}

/* Touch / coarse pointer: swipe works; hide chevron buttons */
@media (pointer: coarse){
	.home-years-bar .home-scroll-btn{
		display: none !important;
	}
}

/* Shared: year + month horizontal strips (class reused on both navs) */
.home-years-bar__inner{
	overflow-x: auto;
	overflow-y: hidden;
	white-space: nowrap;
	-webkit-overflow-scrolling: touch;
	box-sizing: border-box;
	scrollbar-width: none; /* Firefox */
}

/* Only the year scroller: flanks the chevrons in one row (min-width:0 = flex scroll) */
.home-years-bar > .home-years-bar__inner{
	flex: 1 1 auto;
	min-width: 0;
	padding: 3px 0;
}

/* Hide horizontal scrollbars but keep scroll (touch/trackpad) */
.home-years-bar__inner::-webkit-scrollbar{
	height: 0;
}

.home-years-bar__year{
	display: inline-block;
	margin-right: 7px;
	padding: 3px 11px;
	border: 1px solid rgba(37, 95, 10, 0.35);
	border-radius: 999px;
	background: transparent;
	color: #0f4b0a;
	text-decoration: none;
	font-size: 12px;
	line-height: 1;
}

.home-years-bar__year:hover,
.home-years-bar__year:focus{
	background: rgba(37, 95, 10, 0.08);
	text-decoration: none;
}

.home-years-bar__year.is-active{
	background: rgba(37, 95, 10, 0.18);
	color: #0b3a07;
	border-color: rgba(37, 95, 10, 0.55);
}

.home-years-bar__year.is-loading{
	opacity: 0.6;
	pointer-events: none;
}

.home-months-bar__month{
	display: inline-block;
	margin-right: 0;
	padding: 3px 9px;
	border: 1px solid #255f0a;
	border-radius: 999px;
	background: transparent;
	color: #255f0a;
	text-decoration: none;
	flex-shrink: 0;
	font-size: 12px;
	line-height: 1;
}

.home-months-bar__month.is-disabled{
	opacity: 0.35;
	pointer-events: none;
}

.home-months-bar__month.is-active{
	background: rgba(37, 95, 10, 0.18);
	color: #0b3a07;
	border-color: rgba(37, 95, 10, 0.55);
}

.home-months-bar__inner{
	position: relative;
	padding: 3px 10px 6px; /* generous horizontal insets; tight vertical + short indicator band */
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	justify-content: safe center;
	column-gap: 7px;
	row-gap: 2px;
}

.home-months-bar__indicator{
	position: absolute;
	left: 10px;
	right: 10px;
	bottom: 2px;
	height: 2px;
	background: rgba(37, 95, 10, 0.2);
	border-radius: 999px;
	pointer-events: none;
}

.home-months-bar__indicator::after{
	content: "";
	position: absolute;
	top: -2px;
	left: var(--indicator-dot-x, 50%);
	width: 5px;
	height: 5px;
	background: #255f0a;
	border-radius: 999px;
	transform: translateX(-50%);
}

@media (max-width: 767px){
	.home-years-spacer{
		height: 72px;
	}
	.home-years-bar > .home-years-bar__inner{
		padding: 2px 0;
	}
	.home-years-bar__inner::-webkit-scrollbar{
		height: 0;
	}
	.home-years-bar__year{
		padding: 2px 8px;
		margin-right: 5px;
		font-size: 11px;
	}
	.home-years-bar .home-scroll-btn{
		padding: 2px 8px;
		font-size: 9px;
	}
	.home-months-bar__month{
		flex: 1 1 0;
		min-width: 0;
		padding: 2px 1px;
		font-size: 10px;
		border-width: 1px;
		text-align: center;
		box-sizing: border-box;
	}
	.home-months-bar__inner{
		padding: 2px 8px 5px;
		column-gap: 2px;
		justify-content: flex-start;
		width: 100%;
		box-sizing: border-box;
	}
	/* Same horizontal inset as inner side padding so the track matches pill span */
	.home-months-bar__indicator{
		left: 8px;
		right: 8px;
	}
}
.btn-icon-reset{
	background: none;
	padding: 0px;
	border: none;
}

/* Lightbox (local JS, CSP-friendly) */
.lightbox-overlay{
	position: fixed;
	inset: 0;
	z-index: 2000;
	display: none;
}
.lightbox-overlay.is-open{
	display: block;
}
.lightbox-backdrop{
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.72);
}
.lightbox-panel{
	position: absolute;
	inset: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none; /* buttons opt back in */
}
.lightbox-figure{
	margin: 0;
	width: 100%;
	max-width: min(980px, 96vw);
	max-height: 90vh;
	pointer-events: auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.lightbox-img{
	display: block;
	max-width: 100%;
	max-height: 80vh;
	width: auto;
	height: auto;
	border-radius: 10px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.45);
	background: rgba(255, 255, 255, 0.02);
	cursor: zoom-in;
}

/* "Fullscreen" mode: prioritize filling height */
.lightbox-overlay.is-zoomed .lightbox-img{
	max-height: none;
	max-width: none;
	/* Fill the viewport height, leaving room for caption at bottom */
	height: calc(100vh - 56px - env(safe-area-inset-bottom));
	width: auto;
	cursor: grab;
}

/* In zoomed mode we want top/bottom to align with viewport and allow panning */
.lightbox-overlay.is-zoomed .lightbox-panel{
	inset: 0;
	align-items: stretch;
	justify-content: stretch;
}

.lightbox-overlay.is-zoomed .lightbox-figure{
	max-width: none;
	max-height: none;
	width: 100vw;
	height: 100vh;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	padding-top: 10px;
}

/* When the zoomed image overflows horizontally, align to the left so panning reaches edges */
.lightbox-overlay.is-zoomed.is-overflow-x .lightbox-figure{
	align-items: flex-start;
}

.lightbox-overlay.is-zoomed .lightbox-caption{
	margin-top: auto; /* push caption to bottom */
	padding: 10px 12px calc(14px + env(safe-area-inset-bottom));
	width: 100%;
	box-sizing: border-box;
	background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.35));
	font-size: 24px;
}

.lightbox-overlay.is-zoomed .lightbox-img:active{
	cursor: grabbing;
}
.lightbox-caption{
	margin-top: 8px;
	color: rgba(255, 255, 255, 0.85);
	font-size: 18px;
	text-align: center;
}
.lightbox-close{
	position: absolute;
	top: 8px;
	right: 10px;
	pointer-events: auto;
	border: 0;
	background: rgba(0, 0, 0, 0.35);
	color: #fff;
	border-radius: 999px;
	width: 36px;
	height: 36px;
	font-size: 22px;
	line-height: 34px;
	text-align: center;
}
.lightbox-nav{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: auto;
	border: 0;
	background: rgba(0, 0, 0, 0.30);
	color: #fff;
	border-radius: 999px;
	width: 40px;
	height: 40px;
	font-size: 18px;
	line-height: 40px;
	text-align: center;
}
.lightbox-nav--prev{ left: 10px; }
.lightbox-nav--next{ right: 10px; }
.lightbox-nav:disabled{
	opacity: 0.25;
}

/* Prevent background scroll on mobile when open */
.lightbox-open{
	overflow: hidden;
}

.is-hidden{
	display: none;
}

.home-articles-sentinel{
	height: 1px;
}

.home-debug{
	position: fixed;
	right: 8px;
	top: 56px;
	z-index: 2000;
	background: rgba(0,0,0,0.75);
	color: #fff;
	font-family: monospace;
	font-size: 11px;
	line-height: 1.35;
	padding: 8px 10px;
	border-radius: 6px;
	max-width: 45vw;
}
.home-debug a{
	color: #fff;
	text-decoration: underline;
}
.home-debug .home-debug__muted{
	opacity: 0.75;
}

.money-account-table{
	font-size: 90%;
}

.money-account-balance{
	color: grey;
}

.blog-post-content{
	margin-right: 15px;
}

/* Blog posts: more minimalistic than generic .box */
.blog-post.box{
	border: 1px solid rgba(0, 0, 0, 0.08);
	border-radius: 8px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
	margin-bottom: 18px;
	position: relative;
}

/* Subtle “new post starts” accent (low contrast) */
.blog-post.box::before{
	content: "";
	position: absolute;
	left: 0;
	top: 10px;
	bottom: 10px;
	width: 3px;
	background: rgba(37, 95, 10, 0.22);
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
}

.blog-post .box-header{
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.blog-post .aside-header{
	padding: 8px 12px 6px 12px;
}

.blog-post-title{
	margin: 0 0 2px 0;
	font-size: 18px;
	line-height: 1.2;
}

.blog-post-meta{
	color: rgba(0, 0, 0, 0.55);
	font-weight: normal;
	font-size: 12px;
}

.blog-post-tags{
	margin-top: 4px;
	font-size: 12px;
	color: rgba(0, 0, 0, 0.55);
}

.blog-post-tags a{
	color: #255f0a;
}

.blog-post .box-content{
	padding: 10px 12px 12px 12px;
	margin: 0;
}

.blog-post .blog-post-content{
	margin-right: 0;
}

.clear-both{
	clear: both;
}

.aside-header--black{
	color: #000;
}

.comment-row{
	margin-top: 5px;
}

.comment-delete-link{
	margin-top: 10px;
	display: inline-block;
}

.comment-comment-text{
	font-size: smaller;
}

.money-page-row{
	margin-top: 10px;
}

.money-actions-btn{
	width: 80px;
	margin-bottom: 10px;
	padding-bottom: 3px;
}

.graph-per-account{
	height: 200px;
}

.graph-per-year{
	height: 350px;
}

.dashboard-graph{
	height: 200px;
}

.power-payment-btn{
	margin: 2px;
}

.blog-archive-sidebar{
	font-size: 75%;
}

.blog-category-menu{
	font-size: 85%;
}

.blog-category-menu-inner{
	padding: 10px 0;
}

.bank-txt-center{
	text-align: center;
}

.bank-warn-bg{
	background-color: #ffe2e2;
}

.form-no-margin{
	margin-bottom: 0px;
}

.money-negative{
	color: red;
}

.image-index-thumbnails{
	margin: 40px 0 0 0;
}

.label-no-margin{
	margin-bottom: 0;
}

.btn-group-no-margin{
	margin-left: 0;
}

.icon-right-space{
	margin-right: 5px;
}

.img-top-space{
	margin-top: 5px;
}

.form-inline{
	display: inline;
}

.btn-left-space{
	margin-left: 30px;
}

.img-center{
	margin: auto;
}

.tvseries{
	width: 100px;
	height: 100px;
}

.box-content--sm{
	font-size: 75%;
}

.box-content--md{
	font-size: 80%;
}

.blog-archive-yearbox{
	width: 66%;
	margin-left: auto;
	margin-right: auto;
}

.m-5{
	margin: 5px;
}

.tag-form-row{
	margin: 10px;
}

.mt-45{
	margin-top: 45px;
}