@view-transition {navigation: auto;}

body {font-family: "Inter", Helvetica, Arial;background-color:#020324;color:#FDFDF1;}
img {border-radius:10px;}
a,.toggle-button, summary  {text-decoration:none;color:#7BB5F5;}
ul {padding-left:1.1em;}
ol {padding-left:1.7em;}
ul,li, p, figcaption {line-height:26px;}
h1 {margin:15px 0px 15px 0px;line-height:1.3em;font-size:1.8em;}
h2 {line-height:1.3em;font-size:1.4em;}
iframe {border:none;margin:0;padding:0}
hr {border:none;}
section {padding:1px 10px 1px 10px;margin-bottom:5px;border-radius:10px;background-color:#142240;}
li {padding-bottom:5px;}
fieldset {margin:0px;padding:0px;border:none;}
figure {display: flex; align-items: flex-start; margin: 1em 0;}

input[type="text"],[type="password"],[type="submit"], select, textarea, .submit {display:block;background-color:#20364C;color:#BBBBBB;font-size:16px;font-family: "Inter", Helvetica, Arial;border-color:#26334F;border-width:1px;border-style:solid;border-radius:10px;margin:10px 0px 10px 0px;padding:10px;}
input[type="text"],[type="password"] {width:100%;height:26px;}
input[type="submit"] {width:150px;height:46px;background-color:#07659C;color:#FFFFFF;align-items: center;justify-content: center;}
input[type="checkbox"],[type="radio"] {float:left;margin:6px 5px 0px 0px;padding:5px;accent-color: #07659C;}
select, .select {width:100%;height:40px;}
textarea {width:100%;height:80px;}
label {display:inline;line-height:26px;color:#FDFDF1;}
.inactive {background-color:#20364C !important;cursor:pointer;}
.submit {width:130px;height:26px;padding:10px;text-align:center;background-color:#07659C;color:#FFFFFF;line-height:26px;}

#footer {display: flex;position:fixed;bottom:0px;text-align:center;background: rgba(20, 34, 64, 0.80);backdrop-filter: blur(10px);-webkit-backdrop-filter: blur(10px);height:30px;width:100%;max-width:400px;border-color:#26334F;border-width:1px 0px 0px 0px;border-style:solid;padding:15px 0px 5px 0px;}
#footer > * {flex: 1;text-align: center;}
.footer-icon {font-size:26px;color:#FFFFFF;}

.muted {color:#BBBBBB;}
.d-google {display:none;}
.suggestions {position: absolute;z-index: 9999;width:80%;max-width:580px;max-height:400px;margin-top:15px;padding:10px 0px 10px 0px;overflow-y:auto;border-radius:7px;}
.suggestion-item {padding: 8px;background-color:#142240;border-bottom: 1px solid #26334F;}
.layout {display:flex;justify-content: center;gap:20px;padding:0px;box-sizing:border-box;}
.left,.right {width: 200px;}
.center {max-width: 768px;width: 100%;background-color:#020324;}
.square {background:transparent;}
.sky {width:100px;position:sticky;top:0;}
.left .sky {float:right;}
.leader {width:auto;max-width:770px;margin:auto;}
.grid {display: grid;grid-template-columns: 1fr;gap: 20px;}
.col {display: flex;flex-direction: column;gap: 20px;}
.wrapper {display: flex;flex-wrap: wrap;gap:20px;}
.wrapper section {flex: 1 1 calc(50% - 10px);max-width: calc(50% - 10px);box-sizing: border-box;}
.wrapper .full {flex: 0 0 100%;max-width: 100%;}
.container {width:100%;max-width:770px;}
.break {display:none;}
.keywords {display:none;}
.filter-btn {display: none;cursor: pointer;margin: 10px;}
.content {display: flex;gap: 20px;}
.list {flex: 1;order: 1;}
.filter-panel {width: 260px;order: 2;background-color:#020324}
.filter-panel-2 {width: 260px;order: 1;background-color:#020324}
.filter-panel-search {width: 260px;order: 2;background-color:#020324}
.longdesc {display: none;}
#toggle-desc:checked + .longdesc {display: block;}
.filter-btn {float:right;}
.hp {display: grid; grid-template-columns: 1fr; gap: 20px;}
.list {list-style: none;margin:10px 0px 10px 0px;padding: 0;}
.list-item {display: flex;align-items: flex-start;justify-content: flex-start;gap: 10px;}
.list-mark {width:45px;flex: 0 0 45px; text-align: right;white-space: nowrap;}
.list-mark-2 {width:20px;flex: 0 0 20px; text-align: right;white-space: nowrap;}
.list-text {flex: 1 1 auto;min-width: 0; white-space: normal; overflow-wrap: anywhere;}
.list-link {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;min-width:0px;max-width:125px;display: inline-block;float:left;}
.card {clear:both;display:grid;grid-template-columns: 120px 1fr;gap:10px;align-items: start;margin:0px 0px 20px 0px;}
.card-img {width:120px;}
.card-body {line-height:26px;}
.clear {display:inline;}
.text-center {text-align:center;}
.float-right {float:right;}
.alert {border-radius:10px;padding:10px;background: rgba(220, 38, 38, 0.08);color: #fca5a5;border: 1px solid rgba(220, 38, 38, 0.25);}
.check {border-radius:10px;padding:10px;background: rgba(34, 197, 94, 0.08);color: #86efac;border: 1px solid rgba(34, 197, 94, 0.25);}
.scroll-x {display: flex;gap: 12px;overflow-x: auto;overflow-y: hidden;scroll-snap-type: x mandatory;-webkit-overflow-scrolling: touch;padding-bottom: 8px;}
.scroll-x::-webkit-scrollbar {display: none;}
.scroll-item {flex: 0 0 auto; scroll-snap-align: start;border-radius:10px;}
.tabs {margin:0px 0px 0px 0px;}
.tabs > input { position: absolute; opacity: 0; pointer-events: none; }
.tabs > label {display: inline-block;padding: 8px 12px; cursor: pointer;opacity: .7;font-weight: 400;margin-bottom:10px;}
.tabs > input:checked + label {opacity: 1;font-weight: 700;border-bottom: 2px solid currentColor;}
.panels .panel { display: none;}
#t1:checked ~ .panels .p1 { display: block; }
#t2:checked ~ .panels .p2 { display: block; }
#t3:checked ~ .panels .p3 { display: block; }
#t4:checked ~ .panels .p4 { display: block; }
#t5:checked ~ .panels .p5 { display: block; }
.navs {display: flex;gap: 4px;}
.nav {position: relative;padding: 8px 12px;text-decoration: none;opacity: .6;margin:0px 0px 10px 0px;}
.nav.active {opacity: 1;font-weight: 700;}
.nav.active::after {content: "";position: absolute;left: 0;right: 0;bottom: -1px;height: 2px;background: currentColor;}
.filter-app {position: relative;}
.filter-app__toggle {display: none;}
.filter-app__panel {position: absolute;display: none;z-index:10000;width:100%;margin-top:-20px;}
.filter-app__toggle:checked ~ .filter-app__panel {display: block; }
.video-box {position: relative;aspect-ratio: 16 / 9;width: 100%;overflow: hidden;}
.video-box img,.video-box video {width: 100%;height: 100%;display: block;object-fit: cover;}
.play-btn {position: absolute;inset: 0;margin: auto;width: 64px;height: 64px;border-radius: 50%;display: flex;align-items: center;justify-content: center;font-size: 28px;line-height: 1;color: #fff;background: rgba(0, 0, 0, 0.6);box-shadow: 0 10px 30px rgba(0,0,0,0.35);pointer-events: none;}

@media (max-width: 768px) {
.content {display: block;}
.filter-btn {display: block;}
.filter-panel {width:100%;}
.filter-panel-search {display: none; position: fixed;inset: 0;z-index: 100000;overflow-y: auto;width:auto;top:0px;padding:10px;}
.filter-panel-2 {display: block; inset: 0;z-index: 1000;overflow-y: auto;width:auto;top:0px;padding:10px;}
#filter-toggle:checked ~ .filter-panel-search {display: block;}
.close-btn {display: inline-block;cursor: pointer;float:right;margin-top:25px;}
.wrapper section {flex: 1 1 100%;max-width: 100%;}
.layout {padding:0px}
.left,.right {display: none;}
.break {display:block;}
}
@media (min-width: 769px) {
.filter-btn {display: none;}
.close-btn {display: none;}
.filter-panel {position: relative;top: 0px;align-self: flex-start;height: fit-content;}
.filter-panel-2 {position: relative;top: 0px;align-self: flex-start;height: fit-content;}
.hp {grid-template-columns: 1fr 1fr;}
.card {grid-template-columns: 150px 1fr;}
.card-img {width:150px;}
.clear {display:block;}
}

@media (min-width: 900px) {
.grid {grid-template-columns: 60% 40%;gap: 20px;align-items: start;padding-right:20px;}
}
@media (min-width: 1000px) {
.sky {width:200px;}
}
@media (min-width: 1200px) {
.sky {width:250px;}
}	