/* LSPD · Modern Roleplay. All design assets are local to this style. */
@import url("../../prosilver/theme/stylesheet.css");

:root {
	--navy: #101f32;
	--navy-deep: #0b1828;
	--ink: #172838;
	--muted: #516067;
	--gold: #ddbc76;
	--bronze: #7a551e;
	--paper: #f5f3ed;
	--sheet: #fffef9;
	--rule: #d6d5ca;
	--sans: "Segoe UI", Arial, sans-serif;
	--serif: Georgia, "Times New Roman", serif;
	--mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
	--measure: 1152px;
	--gutter: clamp(20px, 4.6vw, 72px);
	--inset: max(var(--gutter), calc((100% - var(--measure)) / 2));
}

html, body { background: var(--paper); color: var(--ink); }
html { height: auto; }
body { margin: 0; padding: 0; font-family: var(--sans); font-size: 11px; }
#wrap.wrap { max-width: none; min-width: 0; margin: 0; padding: 0; border: 0; border-radius: 0; background: var(--paper); }
#page-body, #page-footer { box-sizing: border-box; max-width: var(--measure); margin: 0 auto; width: calc(100% - var(--gutter) * 2); }
#page-body { padding: 22px 0 0; }
#page-footer { margin-top: 35px; }
#page-body::after { display: block; clear: both; content: ""; }

a, a:visited { color: #234866; }
a:hover, a:focus { color: var(--bronze); }
h2, h2 a, h2 a:visited, h3, h3 a { color: var(--ink); }
h2 { margin: 18px 0 12px; font: 500 clamp(25px, 3vw, 38px)/1.15 var(--serif); letter-spacing: -.025em; }
h3 { border-color: var(--rule); }
:where(a, input, select, textarea, button):focus-visible, .button:focus-visible { outline: 3px solid #ac7722; outline-offset: 2px; }

/* The utility bar holds native phpBB search and its permission checks. */
.lspd-masthead { position: relative; color: #fff; background: var(--navy-deep); }
.lspd-skip { position: absolute; z-index: 100; left: var(--inset); top: -80px; background: white; color: var(--ink); padding: 8px 15px; font-size: 14px; }
.lspd-skip:focus { top: 6px; }
.lspd-bar { min-height: 53px; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 8px var(--inset); border-bottom: 1px solid #354451; background: var(--navy-deep); }
.lspd-wordmark, .lspd-wordmark:visited, .lspd-wordmark:hover { display: inline-flex; align-items: center; gap: 9px; color: #f3f0e7; text-decoration: none; white-space: nowrap; }
.lspd-wordmark svg { color: var(--gold); flex: none; }
.lspd-wordmark b { font: 750 17px/1 var(--sans); letter-spacing: .105em; }
.lspd-bar-divider { width: 1px; height: 16px; margin: 0 6px; background: #54606c; }
.lspd-wordmark-label { color: #ced4d7; font: 500 10px/1.3 var(--mono); text-transform: uppercase; letter-spacing: .12em; }
#search-box.lspd-search { float: none; margin: 0; padding: 0; border-radius: 3px; background: transparent; box-shadow: none; }
.lspd-search form, .lspd-search fieldset { margin: 0; padding: 0; }
.lspd-search fieldset { display: flex; align-items: stretch; }
.lspd-search .inputbox, .lspd-search .button { box-sizing: border-box; height: 31px; float: none; border: 1px solid #566272; background: #17293b; color: #eef3f5; box-shadow: none; text-shadow: none; }
.lspd-search .inputbox { min-width: 0; width: 180px; padding: 4px 10px; border-radius: 3px 0 0 3px; font: 13px/1.4 var(--sans); }
.lspd-search .inputbox::placeholder { color: #c4cbd1; }
.lspd-search .button { display: inline-grid; place-items: center; width: 32px; padding: 0; border-left: 0; border-radius: 0; }
.lspd-search .button-search-end { border-radius: 0 3px 3px 0; }
.lspd-search .button .icon { color: #d1d8dd; }
.lspd-search .button:hover, .lspd-search .button:focus { background: #37495b; color: #fff; }
.lspd-search .inputbox:focus { background: #213449; color: white; }

/* An engraved shield is layered over the map on the right of the masthead. */
.lspd-hero { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: center; padding: 0 var(--inset); overflow: hidden; border-bottom: 3px solid #b89656; background: #13283b; }
.lspd-hero::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, #13283b 7%, rgba(19,40,59,.96) 33%, rgba(19,40,59,.14) 65%), url("images/lspd-map.svg") right center / auto 145% no-repeat; pointer-events: none; }
.lspd-hero-copy { padding: 34px 0 38px; }
.lspd-kicker, .lspd-label { margin: 0; color: var(--gold); font: 650 10px/1.5 var(--mono); text-transform: uppercase; letter-spacing: .16em; }
.lspd-kicker { display: flex; align-items: center; gap: 12px; }
.lspd-kicker::before { content: ""; display: inline-block; width: 25px; height: 2px; background: var(--gold); }
.lspd-kicker i { width: 4px; height: 4px; transform: rotate(45deg); background: #bca26f; }
.lspd-title { margin: 13px 0 12px; color: #fffaf0; font: 500 clamp(41px, 5vw, 70px)/.99 var(--serif); letter-spacing: -.052em; }
.lspd-title a, .lspd-title a:visited, .lspd-title a:hover, .lspd-title a:focus { color: inherit; text-decoration: none; }
.lspd-title span { display: block; }
.lspd-intro { margin: 0; color: #d1d8dc; font: 14px/1.5 var(--sans); }
.lspd-emblem { align-self: stretch; display: grid; place-items: center; position: relative; }
.lspd-emblem img { display: block; width: clamp(140px, 13.2vw, 188px); height: auto; filter: drop-shadow(0 7px 7px rgba(0,0,0,.28)); }
body:not(.section-index) .lspd-hero-copy { padding-block: 20px; }
body:not(.section-index) .lspd-title { margin: 8px 0 0; font-size: clamp(26px, 3.1vw, 42px); }
body:not(.section-index) .lspd-title span { display: inline; }
body:not(.section-index) .lspd-intro { display: none; }
body:not(.section-index) .lspd-emblem img { width: 68px; padding-block: 5px; }

#page-header .navbar { margin: 0; padding: 0 var(--inset); background: var(--sheet); border-radius: 0; border-bottom: 1px solid var(--rule); }
.navbar { color: var(--muted); background: var(--sheet); border-radius: 3px; }
.navbar a, .navbar a:visited { color: var(--ink); }
.navbar a:hover { color: var(--bronze); }
#nav-main { padding: 6px 0; }
.navbar ul.linklist { border-color: var(--rule); }
#nav-main > li { font: 570 13px/2.3 var(--sans); }
#nav-main > li > a { display: inline-block; }
.navbar .icon { color: #687784; }
#nav-breadcrumbs { color: var(--muted); padding-block: 5px; }
#nav-breadcrumbs .crumb { font-size: 12px; }
#nav-breadcrumbs .crumb a { color: var(--muted); }

.lspd-directory { display: flex; justify-content: space-between; gap: 15px; align-items: end; padding: 7px 0 19px; }
.lspd-label { color: var(--bronze); font-size: 10px; letter-spacing: .15em; }
.lspd-directory h2 { margin: 5px 0 0; font: 500 clamp(29px, 3.2vw, 40px)/1.1 var(--serif); letter-spacing: -.045em; }
.lspd-index-meta { max-width: 42%; text-align: right; }
.lspd-index-meta p { margin: 0; color: var(--muted); font: 11px/1.6 var(--mono); }
#page-body { counter-reset: lspd-section; }
.forabg, .forumbg { clear: both; overflow: visible; margin: 0 0 19px; padding: 0; border-radius: 3px; border: 1px solid var(--rule); background: var(--sheet); }
.forabg { counter-increment: lspd-section; }
.forabg > .inner > ul:first-child, .forumbg > .inner > ul:first-child { border-radius: 2px 2px 0 0; background: var(--navy); }
li.header { background: var(--navy); color: #f2f0e7; }
li.header dl.row-item { margin: 0; padding: 10px 16px; }
li.header dt, li.header dd, li.header dt a, .forabg .header a, .forumbg .header a { color: #f3f2e9; }
li.header dt { font: 650 13.5px/1.5 var(--sans); text-transform: none; letter-spacing: .015em; }
li.header dl.row-item dt .list-inner { padding-left: 0; }
li.header dd { padding-top: 3px; color: #d0d8dc; font: 10px/1.6 var(--mono); text-transform: uppercase; letter-spacing: .055em; }
li.header dd, li.header dt { margin-top: 0; margin-bottom: 0; }
.forabg .header a:hover, .forumbg .header a:hover { color: var(--gold); }
.forabg > .inner > ul:first-child li.header dt .list-inner::before { content: counter(lspd-section, decimal-leading-zero); display: inline-block; margin-right: 13px; padding-right: 13px; border-right: 1px solid #506071; color: var(--gold); font: 11px/1 var(--mono); vertical-align: 1px; }
ul.forums { background: var(--sheet); }
li.row { background: var(--sheet); border: 0; border-top: 1px solid var(--rule); }
li.row:first-child { border-top: 0; }
li.row:hover { background: #f3f1e7; }
ul.topiclist li.row, li.row strong { color: var(--muted); }
ul.topiclist li.row dl { margin: 0; }
ul.topiclist li.row dd, ul.topiclist li.row:hover dd { border-color: transparent; }
ul.topiclist.forums li.row { padding: 0 16px; }
ul.topiclist.forums dl.row-item { display: flex; align-items: center; min-height: 68px; padding-block: 4px; background-image: none; }
ul.topiclist.forums dl.row-item dt { min-width: 0; font-size: 12.5px; line-height: 1.5; }
ul.topiclist.forums dl.row-item dt .list-inner { padding: 6px 12px 6px 48px; }
ul.topiclist.forums dl.row-item dd { flex: none; min-height: 0; padding: 4px 0; margin: 0; }
ul.topiclist.forums dl.row-item dd.lastpost { font: 12px/1.45 var(--sans); }
ul.topiclist.forums dl.row-item dd.topics, ul.topiclist.forums dl.row-item dd.posts { color: #435461; font: 12px/1.4 var(--mono); }
ul.topiclist.forums dl.row-item::before { content: "\f07b"; position: absolute; left: 0; top: 50%; width: 33px; height: 33px; display: grid; place-items: center; box-sizing: border-box; transform: translateY(-50%); color: #53687a; background: #edf0ec; border: 1px solid #d0d7d2; border-radius: 4px; font: normal 15px/1 FontAwesome; pointer-events: none; }
ul.topiclist.forums dl.forum_read_subforum::before, ul.topiclist.forums dl.forum_unread_subforum::before { content: "\f0c5"; }
ul.topiclist.forums dl.forum_read_locked::before, ul.topiclist.forums dl.forum_unread_locked::before { content: "\f023"; }
ul.topiclist.forums dl.forum_link::before { content: "\f08e"; }
ul.topiclist.forums dl[class*="forum_unread"]::before { color: #fff7de; background: #6e511e; border: 2px solid #6e511e; }
ul.topiclist.forums dl[class*="forum_unread"]::after { content: ""; position: absolute; left: 27px; top: calc(50% - 18px); height: 6px; width: 6px; border: 2px solid var(--sheet); border-radius: 50%; background: #b6852e; pointer-events: none; }
ul.forums dl a.row-item-link { left: 0; width: 33px; height: 33px; margin: -16px 0 0; z-index: 1; }
a.forumtitle, a.forumtitle:visited, a.topictitle, a.topictitle:visited { color: var(--ink); font: 650 15.5px/1.45 var(--sans); letter-spacing: -.018em; }
a.forumtitle:hover, a.topictitle:hover { color: var(--bronze); }
a.lastsubject { color: #234866; font-weight: 650; }
a.subforum { font-weight: 600; }
.forum-image img { max-width: 40px; max-height: 42px; object-fit: contain; }
a.mark-read { font: 12px/1.5 var(--sans); }
.topiclist.topics li.row dl { padding-block: 8px; }

/* Shared phpBB views: conversations, forms, control panels and messages. */
.panel, .post { margin-bottom: 9px; border: 1px solid var(--rule); border-radius: 3px; color: var(--ink); }
.panel { padding: 12px 16px; background: var(--sheet); }
.post { padding: 14px 16px; }
.bg1, .bg3, .panel-container .panel, .cp-main .panel { background-color: var(--sheet); }
.bg2, .panel-container .panel .panel, .panel-container .panel.bg2 { background-color: #f1f0e9; }
.post.unreadpost { border-left: 3px solid #ad852f; }
.postprofile, .signature, .notice { border-color: var(--rule); }
.postprofile dt, .postbody, .postbody .content { color: var(--ink); }
.postprofile dd, .author, .notice, .copyright { color: var(--muted); }
.postbody .content { font: 15px/1.65 var(--sans); }
.postbody h3, .stat-block h3, .headerspace h3 { color: var(--ink); font: 600 18px/1.4 var(--serif); text-transform: none; }
.stat-block, form.headerspace { margin: 12px 0; padding: 13px 16px; background: var(--sheet); border: 1px solid var(--rule); border-radius: 3px; }
.stat-block h3, form.headerspace h3 { margin: 0 0 8px; padding-bottom: 6px; }
.stat-block p { margin: 0; color: var(--muted); font: 12.5px/1.55 var(--sans); }
form.headerspace label, .quick-login a { font-size: 12px; }
.quick-login { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 10px; }
fieldset.quick-login label, fieldset.quick-login input.inputbox { float: none; }
blockquote, .codebox { border-color: #cfcab9; background-color: #f1eee3; }
blockquote blockquote { background-color: #faf7ed; }
blockquote, blockquote cite, .codebox p { color: var(--ink); }
.inputbox, select, textarea { border-color: #aeb6b8; color: var(--ink); background-color: #fffefb; }
.inputbox:hover, select:hover, textarea:hover { border-color: #827552; }
.inputbox:focus { border-color: #967231; }
.button, a.button1, a.button2, input.button1, input.button2, input.button3 { color: #243e53; background: #fcfbf6; border-color: #bfc3bc; border-radius: 3px; box-shadow: none; text-shadow: none; font-family: var(--sans); }
.button .icon { color: inherit; }
.button:hover, .button:focus, a.button1:hover, a.button2:hover, input.button1:hover, input.button2:hover, input.button3:hover { background: #f1ead8; border-color: #a18756; color: #674a1b; text-shadow: none; }
.action-bar > .button, input.button1, .quick-login input.button2 { color: white; background: var(--navy); border-color: var(--navy); }
.action-bar > .button:hover, .action-bar > .button:focus, input.button1:hover, .quick-login input.button2:hover { color: #fff; background: #294257; }
.pagination li a { background: var(--sheet); border-color: var(--rule); color: #2a475d; }
.pagination li.active span, .pagination li a:hover { background: var(--navy); border-color: var(--navy); color: #fff; }
.dropdown .dropdown-contents { color: var(--ink); background: var(--sheet); border-color: var(--rule); }
.dropdown li, .dropdown .sep { border-color: var(--rule); }
.dropdown-extended .header, .dropdown-extended .footer { color: var(--ink); background: #e9e8df; text-shadow: none; }
.dropdown-extended .notification-block:hover { color: var(--ink); background: #eeecdf; }
.notification_list p.notification-title, .notification_list p.notification-time, .notification_list p.notifications-time { color: var(--ink); }
.tabs .tab > a, .minitabs .tab > a { color: #314a5c; background: #e4e5dc; }
.tabs .activetab > a, .tabs .activetab > a:hover, .minitabs .activetab > a, .minitabs .activetab > a:hover { color: var(--ink); background: var(--sheet); border-color: var(--rule); box-shadow: none; }
.navigation a, .rtl .navigation a { color: var(--ink); background: #e9e8df; }
.navigation .active-subsection a, .navigation a:hover { color: var(--ink); background: var(--sheet); }
.rules { border-left: 3px solid #b58c43; color: #45391e; background: #f1e8cd; }
table.table1 tbody tr { color: var(--ink); background: var(--sheet); border-color: var(--rule); }
table.table1 tbody tr:hover { color: var(--ink); background: #f0eee3; }
table.table1 thead th, table.table1 thead th a { color: #fff; background: var(--navy); }
.lspd-imprint { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; border-top: 2px solid var(--navy); padding: 15px 0; color: var(--muted); font: 10px/1.5 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.lspd-imprint-brand { color: var(--ink); }
.lspd-imprint-brand b { margin-right: 10px; color: var(--ink); font: 750 15px var(--sans); letter-spacing: .08em; }
#page-footer .navbar { padding-inline: 12px; border: 1px solid var(--rule); }
.copyright { padding: 18px 0 30px; }
.footer-row a, .copyright a { color: #4c5b60; }
body:not([class*="section-"]) #page-body { padding-bottom: 20px; }

@media (min-width: 701px) and (max-width: 960px) {
	ul.topiclist.forums li.row { padding-inline: 10px; }
	li.header dl.row-item { padding-inline: 10px; }
}
@media (max-width: 700px) {
	:root { --gutter: 16px; }
	#page-body { padding-top: 14px; }
	.lspd-bar { min-height: 45px; }
	.lspd-search { display: none !important; } /* phpBB supplies the mobile search in navbar_header. */
	.lspd-wordmark b { font-size: 15px; }
	.lspd-wordmark-label { font-size: 9px; }
	.lspd-hero { grid-template-columns: minmax(0, 1fr) minmax(70px, 24%); gap: 8px; }
	.lspd-hero::before { background-size: auto, auto 108%; background-position: 0 0, 85% 50%; }
	.lspd-hero-copy { padding: 27px 0 29px; }
	.lspd-title { font-size: clamp(28px, 7.7vw, 45px); letter-spacing: -.055em; margin: 11px 0 9px; }
	.lspd-intro { font-size: 12px; line-height: 1.45; max-width: 29em; }
	.lspd-kicker { font-size: 8px; gap: 7px; letter-spacing: .10em; }
	.lspd-kicker::before { width: 13px; }
	.lspd-kicker i { width: 3px; height: 3px; }
	.lspd-emblem img { width: min(100%, 115px); }
	body:not(.section-index) .lspd-hero-copy { padding-block: 13px; }
	body:not(.section-index) .lspd-title { font-size: clamp(23px, 5vw, 30px); }
	body:not(.section-index) .lspd-emblem img { width: 47px; }
	#nav-main { padding-block: 3px; }
	#nav-main > li { font-size: 12px; }
	.lspd-directory { align-items: start; flex-direction: column; gap: 5px; padding: 3px 0 13px; }
	.lspd-label { font-size: 9px; }
	.lspd-directory h2 { font-size: 29px; margin-top: 2px; }
	.lspd-index-meta { max-width: none; text-align: left; }
	.lspd-index-meta p { font-size: 10px; }
	.forabg, .forumbg, .post, .panel { margin-inline: 0; }
	li.header dt { text-align: left; }
	li.header dl.row-item { padding: 9px 12px; }
	li.header dt .list-inner { padding: 0; }
	ul.topiclist.forums li.row { padding-inline: 12px; }
	ul.topiclist.forums dl.row-item { min-height: 60px; }
	ul.topiclist.forums dl.row-item dt, ul.topiclist.forums dl.row-item dt .list-inner { margin-right: 0; }
	ul.topiclist.forums dl.row-item dt .list-inner { padding-left: 42px; padding-right: 0; }
	ul.topiclist.forums dl.row-item::before { width: 30px; height: 30px; }
	ul.topiclist.forums dl.row-item dt { font-size: 12px; }
	ul.topiclist.forums dd.lastpost { display: none; }
	a.forumtitle, a.topictitle { font-size: 14.5px; }
	.forabg { margin-bottom: 13px; }
	.lspd-imprint { gap: 5px; }
}
@media (max-width: 370px) {
	:root { --gutter: 12px; }
	.lspd-hero { grid-template-columns: minmax(0, 1fr) 63px; }
	.lspd-title { font-size: clamp(25px, 7.7vw, 29px); }
	.lspd-wordmark-label { letter-spacing: .04em; }
}
@media print {
	#page-header .navbar, #page-footer .navbar, .lspd-search, .lspd-emblem { display: none !important; }
	.lspd-hero { border-bottom: 1px solid #555; display: block; background: white; }
	.lspd-hero::before { display: none; }
	.lspd-title, .lspd-kicker, .lspd-intro { color: black; }
}
