:root{
  /* background — true black */
  --1d2021: #000000;
  --282828: #0a0a0a;
  --3c3836: #111111;
  --504945: #1c1c1c;

  /* font */
  --928374: #928374;
  --a89984: #a89984;
  --bdae93: #bdae93;
  --8ec07c: #8ec07c;
  --ebdbb2: #ebdbb2;

  /* code highlighter */
  --comment: #9e8e73;
  --default: #d4be98;
  --keyword: #d8a657;
  --string: #7daea7;

  /* color codes for instance list */
  --green: #b8bb26;
  --yellow: #d8a657;
  --red: #fb4934;
}

audio{
  max-width:100%;
  display:block;
}

.left audio{
  margin-top:7px;
}

.right-wrapper audio{
  margin-bottom:17px;
}

body,html{
  padding:0;
  margin:0;
}

body{
  background:#000000 !important;
  color:var(--a89984);
  font-size:16px;
  box-sizing:border-box;
  font-family:sans-serif;
  margin:15px 7% 45px;
  word-wrap:anywhere;
  line-height:22px;
  max-width:2000px;
  position:relative;
}

.navigation{
  position:absolute;
  top:0;
  right:0;
  font-size:14px;
  line-height:40px;
}

.navigation a{
  color:var(--bdae93);
  text-decoration:none;
}

.navigation a:hover{
  text-decoration:underline;
}

.navigation a:not(:last-child)::after{
  content:"|";
  padding:0 7px;
  display:inline-block;
  color:var(--504945);
}

h1,h2,h3,h4,h5,h6{
  padding:0;
  margin:0 0 7px 0;
  line-height:initial;
  color:var(--bdae93);
}

h3,h4,h5,h6{
  margin-bottom:14px;
}

/* Web styles */
#overflow{
  overflow:hidden;
}

/* Searchbox */
.searchbox{
  width:40%;
  height:36px;
  border:1px solid var(--504945);
  background:var(--282828);
  border-radius:2px;
  margin-bottom:10px;
  position:relative;
}

.searchbox .wrapper{
  overflow:hidden;
}

.searchbox input[type="text"]{
  width:100%;
  padding-left:10px;
}

.searchbox input[type="text"]::placeholder{
  color:var(--928374);
}

.searchbox input[type="submit"]{
  float:right;
  cursor:pointer;
  padding:0 10px;
  background:#2a2a2a !important;     /* ← dark gray button */
  color:#ffffff !important;
}

.searchbox input[type="submit"]:hover{
  background:#383838 !important;     /* ← slightly lighter on hover */
  text-decoration:underline;
}

.searchbox input{
  all:unset;
  line-height:36px;
  box-sizing:border-box;
  height:36px;
  color:var(--bdae93);
}

.searchbox:focus-within{
  border:1px solid var(--928374);
}

.autocomplete{
  display:none;
  position:absolute;
  top:35px;
  left:-1px;
  right:-1px;
  background:var(--282828);
  border:1px solid var(--928374);
  border-top:none;
  border-radius:0 0 2px 2px;
  z-index:10;
  overflow:hidden;
}

.autocomplete .entry{
  overflow:hidden;
  padding:4px 10px;
  cursor:pointer;
  outline:none;
  user-select:none;
}

.autocomplete .entry:hover,
.autocomplete .entry:focus{
  background:var(--3c3836);
}

/* Tabs */
.tabs, .filters{
  overflow:hidden;
  overflow-x:auto;
  white-space:nowrap;
}

.tabs{
  padding-bottom:10px;
}

.tabs .tab{
  text-decoration:none;
  color:var(--bdae93);
  padding:4px 10px;
  display:inline-block;
}

.tabs .tab:hover{
  text-decoration:underline;
}

.tabs .tab.selected{
  border-bottom:2px solid var(--bdae93);
}

/* Filters */
.filters{
  margin-bottom:7px;
}

.filters .filter{
  display:inline-block;
  margin-right:7px;
  vertical-align:bottom;
}

.filters .filter .title{
  font-size:13px;
  margin:0 4px;
}

.filters .filter input,
.filters .filter select{
  all:unset;
  user-select:none;
  display:block;
  border:1px solid var(--504945);
  border-radius:2px;
  font-size:14px;
  padding:0 4px;
  width:127px;
  height:24px;
}

.timetaken{
  font-size:14px;
  font-weight:bold;
  margin-bottom:10px;
}

/* HOME */
.home{
  min-height:100vh;
  margin:0 auto;
  display:table;
  text-align:center;
}

.home .logo{
  max-width:400px;
  height:100px;
  margin:0 auto 17px auto;
}

.home img{
  line-height:100px;
  font-size:60px;
  text-align:center;
  font-family:Times;
  width:100%;
  height:100%;
  background:var(--282828);
  display:block;
  object-fit:contain;
}

.home #center{
  display:table-cell;
  vertical-align:middle;
  width:500px;
}

.home .searchbox{
  width:100%;
  text-align:left;
  margin-bottom:20px;
}

.home a{
  color:inherit;
}

.home .subtext{
  margin-top:17px;
  line-height:16px;
  font-size:12px;
}

/* WEB — everything else 100% unchanged */
.captcha-wrapper{position:relative;max-width:400px;margin:17px auto 0;border:1px solid var(--928374)}
.captcha{padding-bottom:100%;padding-top:6.2%}
.captcha-wrapper img{position:absolute;top:0;left:0;width:100%;height:100%;display:block;background:#282828}
.captcha-controls{position:absolute;top:0;left:0;bottom:0;right:0;top:6.3%}
.captcha-wrapper input{display:none}
.captcha-wrapper label{float:left;width:25%;height:25%;position:relative;cursor:pointer}
.captcha-wrapper label:hover{background:rgba(255,255,255,0.2)}
.captcha-wrapper input:checked + label{background:rgba(0,0,0,0.5)}
.captcha-wrapper input:checked + label:after{content:"";position:absolute;left:39%;top:29%;width:20%;height:30%;transform:rotate(45deg);border-right:7px solid var(--ebdbb2);border-bottom:7px solid var(--ebdbb2);box-sizing:border-box}
.captcha-submit{float:right;margin:12px 0 4px}
.web .left{width:40%;float:left}
.infobox{border:1px dashed var(--504945);padding:10px;margin-bottom:17px;overflow:hidden}
.infobox .code{white-space:initial}
.infobox ul{padding-left:27px;margin-bottom:0}
.infobox a{color:var(--bdae93)}
.infobox a:hover{text-decoration:underline}
.web .text-result{margin-bottom:30px}
.web .description{white-space:pre-line}
.web .type{border:1px solid var(--928374);background:var(--282828);padding:0 4px;border-radius:2px;font-size:14px;line-height:16px;float:left;margin:2px 7px 0 0}
.web .url{position:relative}
.web .url .part{font-size:15px;text-decoration:none;color:var(--928374)}
.web .separator::before{content:"/";padding:0 4px;color:var(--504945);font-size:12px}
.web .part:hover{text-decoration:underline}
.web .hover{display:block;text-decoration:none;color:var(--a89984);overflow:hidden;clear:left;padding-top:7px}
.web .text-result .title{font-size:18px;color:var(--bdae93);margin-bottom:7px}
.web .text-result a:visited .title{color:var(--928374)!important}
.theme-white .web .text-result a:visited .title{color:#7c6f64!important}
.web .text-result .hover:hover .title{text-decoration:underline}
.web .text-result .author{font-style:italic}
.web .text-result .greentext{font-size:14px;color:var(--8ec07c)}
.web .right-right .text-result:last-child,.web .right-left .text-result:last-child{margin-bottom:0}
.favicon{all:unset;float:left;cursor:pointer}
.favicon-dropdown{display:none;position:absolute;top:25px;background:var(--282828);border:1px solid var(--504945);border-radius:2px;z-index:3;word-wrap:normal}
.favicon-dropdown::before{content:"";position:absolute;top:-10px;left:2px;border:5px solid transparent;border-bottom:5px solid var(--504945)}
.favicon-dropdown a{text-decoration:none;color:var(--bdae93);display:block;padding:2px 7px 2px 5px;font-size:13px}
.favicon-dropdown a:hover{text-decoration:underline}
.favicon-dropdown:hover,.favicon:focus + .favicon-dropdown,.favicon-dropdown:focus-within{display:block}
.web .favicon img,.favicon-dropdown img{margin:3px 7px 0 0;width:16px;height:16px;font-size:12px;line-height:16px;text-align:center;display:block;text-align:left;white-space:nowrap}
.favicon-dropdown img{float:left;margin:2px 7px 0 0}
.thumb-wrap{position:relative;float:right;width:160px;height:90px;background:var(--282828);border:1px solid var(--504945);margin-left:7px}
.duration{position:absolute;right:0;bottom:0;padding:1px 2px;line-height:14px;background:var(--3c3836);font-size:12px;border-left:1px solid var(--504945);border-top:1px solid var(--504945);font-family:monospace}
.web .text-result:hover .thumb-wrap .duration{display:none}
.thumb-wrap .thumb{display:block;object-fit:contain;width:100%;height:100%}
.thumb-wrap.portrait{width:50px}
.thumb-wrap.square{width:90px}
.nextpage{margin:0 0 30px;text-align:center;display:block;padding:10px;border:1px solid var(--504945);border-radius:2px;text-decoration:none;color:var(--bdae93)}
.nextpage:hover{text-decoration:underline}
.web .right-wrapper{width:60%;float:right;overflow:hidden;padding-left:15px;box-sizing:border-box}
.web .right-right,.web .right-left{float:right;width:50%;padding:0 15px;box-sizing:border-box;overflow:hidden;min-height:1px}
.web .right-right{padding-right:0}
table{width:100%;text-align:left;border-collapse:collapse}
table td{width:50%;padding:0;vertical-align:top}
table tr td:first-child{padding-right:7px}
table a{display:block;text-decoration:none;color:var(--a89984);padding:0 10px 0 0}
table tr a:last-child{padding-right:0}
.related{margin-bottom:20px}
.related a{padding-bottom:10px;color:var(--bdae93)}
.related a:hover{text-decoration:underline}
.web .answer{max-height:600px;overflow:hidden;padding-bottom:17px;position:relative}
.web .answer::after{content:"";position:absolute;bottom:0;width:100%;height:17px;background:linear-gradient(transparent,#000000);pointer-events:none}
.web .answer-title{text-decoration:none;color:var(--a89984)}
.web .answer-title a:hover{text-decoration:underline}
.web .spoiler:checked + .answer{overflow:initial;max-height:initial}
.web .spoiler{display:none}
.web .spoiler-button{display:block;border:1px solid var(--504945);border-radius:2px;line-height:30px;padding:0 7px;text-align:center;cursor:pointer}
.web .answer-wrapper{margin-bottom:27px}
.web .spoiler-button:hover{text-decoration:underline}
.web .spoiler-button::before{content:"Show more"}
.web .spoiler:checked + .answer + .spoiler-button::before{content:"Show less"}
.web .info-table{margin:10px 0;font-size:15px;color:var(--928374);background:var(--282828);border:1px dashed var(--504945)}
.web .info-table td{padding:4px 10px}
.web .info-table tr td:first-child{width:1%;white-space:nowrap;padding-right:17px;color:var(--a89984)}
.web .info-table tr:nth-child(even){background:#000000}
.web .sublinks{padding:17px 10px 0;font-size:15px;color:var(--928374)}
.web .sublinks table td{padding-bottom:17px}
.web .sublinks table tr:last-child td:last-child{padding-bottom:0}
.web .sublinks a:hover .title{text-decoration:underline}
.web .wiki-head .photo{float:right;margin:0 1px 10px 10px}
.web .wiki-head .photo img{display:block;max-width:200px;max-height:200px;filter:drop-shadow(1px 0 0 var(--504945)) drop-shadow(-1px 0 0 var(--504945)) drop-shadow(0 -1px 0 var(--504945)) drop-shadow(0 1px 0 var(--504945))}
.web .wiki-head .description{clear:left;padding-top:7px;overflow:hidden}
.web .wiki-head table,.about table{margin-top:17px;border:1px dashed var(--504945);background:#000000}
.web .wiki-head table td{white-space:pre-line}
.web .wiki-head td,.about table td{padding:4px 7px;vertical-align:middle}
.web .wiki-head tr td:first-child,.about table tr td:first-child{width:30%;min-width:150px}
.web .wiki-head tr:nth-child(odd),.about table tr:nth-child(odd){background:var(--282828)}
.web .wiki-head .socials{overflow:hidden;margin-top:17px}
.web .wiki-head .socials a{width:74px;height:80px;padding-right:4px;float:left;color:var(--bdae93);text-decoration:none;display:table}
.web .wiki-head .socials a:hover .title{text-decoration:underline}
.web .wiki-head .socials .center{display:table-cell;vertical-align:middle}
.web .wiki-head .socials img{margin:0 auto;display:block;text-align:center;width:36px;height:36px;line-height:36px}
.web .wiki-head .socials .title{margin-top:7px;text-align:center;font-size:13px;line-height:13px}
.web .fullimg{display:block;max-width:100%;max-height:150px;margin:7px 0 17px;box-sizing:border-box;border:1px solid var(--504945)}
.code{white-space:pre;font-family:monospace;background:var(--3c3836);color:var(--bdae93);padding:7px;margin:4px 0 13px 0;overflow-x:auto;border-radius:2px;border:1px solid var(--504945)}
.code-inline{display:inline;font-family:monospace;background:var(--282828);color:var(--bdae93);border:1px solid var(--928374);padding:0 4px;border-radius:2px}
.web .wiki-head h2{font-size:20px;margin:20px 0 13px 0}
.web .wiki-head h2:first-child{margin-top:10px}
.web .wiki-head a{color:var(--bdae93)}
.quote{font-style:italic;margin:10px 0 13px;padding-left:10px;border-left:1px solid #504945}
.web .images{overflow:hidden;margin:0 -5px;font-size:0}
.web .images .duration{display:none;border:1px solid var(--504945);right:5px;bottom:5px}
.web .images .image:hover .duration{display:block}
.web .images .image{width:90px;height:90px;padding:5px;position:relative;line-height:90px;display:inline-block;text-align:center;color:inherit}
.web .images .image img{max-width:100%;max-height:100%;vertical-align:middle}
#images{overflow:hidden;margin-bottom:10px}
#images .infobox{width:40%;box-sizing:border-box}
#images .image-wrapper{line-height:15px;width:20%;float:left}
#images .image{margin:0 auto;width:250px;max-width:100%;padding:7px 7px 30px 7px;box-sizing:border-box;font-size:14px}
#images a{color:inherit;text-decoration:none;display:block}
#images a:hover .title{text-decoration:underline}
#images .thumb{display:block;height:180px;margin-bottom:10px;position:relative}
#images .duration{display:block;border:1px solid #504945}
#images .image:hover .duration{display:none}
#images img{width:100%;height:100%;object-fit:contain}
#images .image .title{white-space:nowrap;overflow:hidden;margin-bottom:7px;font-weight:bold}
#images .image .description{overflow:hidden;height:45px}
.nextpage.img{width:50%;margin:0 auto 50px}
#popup{display:none;position:fixed;top:0;left:0;cursor:grab;user-select:none;pointer-events:none;z-index:5}
#popup:active{cursor:grabbing}
#popup-image{border:1px solid var(--928374);display:block;margin:0 auto;pointer-events:all;width:100%;height:100%;object-fit:contain;background:var(--282828)}
#popup-status{display:none;position:fixed;top:0;left:0;width:100%;height:35px;background:#000000;border-bottom:1px solid var(--928374);z-index:4}
#popup-bg{background:#000000;opacity:.5;position:fixed;top:0;left:0;width:100%;height:100%;display:none;z-index:3}
#popup-status select{display:block;width:250px}
#popup-num,#popup-title{display:table-cell;width:0;word-wrap:normal;padding:0 10px;line-height:35px;color:var(--ebdbb2);text-decoration:none}
#popup-title:hover{text-decoration:underline}
#popup-title{width:initial;overflow:hidden;height:35px;display:block}
#popup-num{font-weight:bold}
#popup-dropdown{display:table-cell;vertical-align:middle;width:0}
.web .settings{margin-top:17px;border:1px dashed var(--504945);padding:7px 10px 0}
.web .setting{margin-bottom:17px}
.web .setting .title{font-size:14px}
.web .settings-submit{margin:17px 10px}
.web .settings-submit input{float:right}
.web .settings-submit a{margin-right:17px;color:var(--bdae93)}
.about a{color:var(--bdae93)}
.about h1,.about h2{margin-top:17px}
.about table{margin-bottom:17px}
.about table a{display:inline}
.c-comment{color:var(--comment)}
.c-default{color:var(--default)}
.c-keyword{color:var(--keyword);font-weight:bold}
.c-string{color:var(--string)}
.instances table{white-space:nowrap;margin-top:17px}
.instances a{color:var(--bdae93)}
.instances tbody tr:nth-child(even){background:var(--282828)}
.instances thead{outline:1px solid var(--928374);outline-offset:-1px;background:var(--3c3836);user-select:none;z-index:2;position:sticky;top:0}
.instances th{cursor:row-resize}
.instances th:hover{background:var(--504945)}
.instances tbody{outline:1px solid var(--504945);outline-offset:-1px;position:relative;top:-1px}
.instances tbody tr:hover{background:var(--3c3836);cursor:pointer}
.instances .arrow{display:inline-block;position:relative;top:6px;margin-right:7px;width:0;height:0;border:6px solid transparent;border-top:10px solid var(--bdae93)}
.instances .arrow.up{top:0;border:6px solid transparent;border-bottom:10px solid var(--bdae93)}
.instances th,.instances td{padding:4px 7px;width:0}
.instances .extend{width:unset;overflow:hidden;max-width:200px}
.instances .popup-wrapper{display:none;position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:800px;max-width:100%;max-height:100%;overflow-x:auto;padding:17px;box-sizing:border-box;pointer-events:none;z-index:3}
.instances .popup{border:1px solid var(--928374);background:var(--282828);padding:7px 10px;pointer-events:initial}
.instances ul{padding-left:20px}
.instances .go-back{margin-top:17px;display:inline-block}

/* Responsive */
@media only screen and (max-width:1454px){#images .image-wrapper{width:25%}}
@media only screen and (max-width:1161px){#images .image-wrapper{width:33.3333%}}
@media only screen and (max-width:750px){#images .image-wrapper{width:50%}}
@media only screen and (max-width:450px){#images .image-wrapper{width:100%}}
@media only screen and (max-width:1550px){
  .web .right-right,.web .right-left{float:none;width:initial;padding:0 0 0 15px}
  .web .left,.searchbox,#images .infobox{width:60%}
  .web .right-wrapper{width:40%}
}
@media only screen and (max-width:1000px){
  form{padding-top:27px}
  .navigation{left:0;right:unset;line-height:22px}
  .nextpage.img{width:initial}
  .web .right-right,.web .right-left{border:none;padding:0}
  .web .right-wrapper{float:none;padding:0;width:initial}
  .web .left,.searchbox{width:100%}
  body:not(.instances) table td{display:block;width:100%}
  table a{padding:0}
  .web.has-answer .left::before{display:block;content:"Results";font-size:24px;font-weight:bold;margin-bottom:17px;color:var(--bdae93)}
  .web .answer{max-height:200px}
  .web .wiki-head tr td:first-child,.web .info-table tr td:first-child{text-decoration:underline}
  #images .infobox{width:100%}
}