/* ===== Metin2Can: hasar simulatoru sitenin koyu temasiyla ===== */
:root{
  --bg:#1b171a; --bg-grad:#241e22; --panel:rgb(30 21 30 / .62); --panel2:rgb(38 27 37 / .58); --panel3:rgb(48 34 46 / .62);
  --solid:#241b22; --input:rgb(18 12 18 / .60);
  --line:rgb(92 66 86 / .45); --line2:rgb(120 86 112 / .55);
  --text:#d4c9cc; --dim:#9b8e93; --faint:#6d6267;
  --wine:#8e1f32; --wine2:#ad2a3f; --gold:#c9a254; --gold2:#e0c07f;
  --shadow:0 10px 30px #0008; --r:8px;
}
*{box-sizing:border-box}
html,body{margin:0}
html{background:var(--bg)}
body.sim,body.sim-liste{color:var(--text);font:13px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  background:radial-gradient(1200px 500px at 50% -150px,var(--bg-grad),var(--bg)) fixed,var(--bg)}
html.ap body.sim{background:transparent}
html,body,*{cursor:url(/element/mouse.cur),url(/img/imlec.png) 1 1,default}
a,button,label,select,summary,[role=button],.button,.modal-trigger,input[type=radio]+img,.mw-collapsible-toggle{cursor:url(/element/mouse.cur),url(/img/imlec-el.png) 1 1,pointer!important}
input[type=text],input[type=number],input[type=search],textarea{cursor:text!important}

/* arka plan gorseli (ana sayfadakiyle ayni) */
#arkaplan{position:fixed;inset:0;z-index:-1;background:var(--bg) center 20%/cover no-repeat;opacity:0;transition:opacity .6s;filter:brightness(1.12) saturate(1.05)}
#arkaplan::after{content:"";position:absolute;inset:0;
  background:radial-gradient(1400px 700px at 50% 0,rgb(40 18 44 / .20),rgb(14 8 16 / .38) 70%),linear-gradient(180deg,rgb(16 9 18 / .06),rgb(10 6 12 / .24))}
html.ap-hazir #arkaplan{opacity:1}

.sarma{max-width:1500px;margin:0 auto;padding:16px}

/* ust kisim: ana sayfadaki baslikla ayni */
.ust{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.ust .logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.ust .logo img{width:46px;height:46px;filter:drop-shadow(0 2px 4px #0008);transition:filter .25s}
.ust .logo b{display:block;margin:0;font:700 21px/1.2 Georgia,"Times New Roman",serif;letter-spacing:.4px;transition:text-shadow .25s;
  background:linear-gradient(180deg,var(--gold2),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
.ust .logo small{display:block;color:var(--dim)!important;font-size:12px}
.ust .logo,.ust .logo:hover{opacity:1;color:inherit}
.ust .logo:hover img{filter:drop-shadow(0 2px 4px #0008) drop-shadow(0 0 7px rgba(255,214,120,.55)) brightness(1.08)}
.ust .logo:hover b{text-shadow:0 0 10px rgba(255,214,120,.45)}
.chip{background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:4px 11px;color:var(--dim);font-size:12px;white-space:nowrap;text-decoration:none;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.chip:hover{color:var(--gold2);border-color:var(--gold)}
.bosluk{flex:1}
.ibtn{display:flex;align-items:center;gap:7px;height:38px;padding:0 10px;border-radius:var(--r);border:1px solid var(--line);background:var(--panel);
  color:var(--text);font-weight:700;font-size:13px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.ibtn:hover{border-color:var(--line2)}
.dil{position:relative}
.bayrakk{width:20px;height:14px;border-radius:2px;box-shadow:0 0 0 1px #0006;flex:none}
.dil-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:200;min-width:150px;padding:5px;border-radius:10px;border:1px solid var(--line2);background:var(--solid);box-shadow:var(--shadow)}
.dil-menu button{display:flex;align-items:center;gap:9px;width:100%;padding:7px 9px;border:0;border-radius:7px;background:none;color:var(--text);text-align:left;font:inherit}
.dil-menu button:hover,.dil-menu button.on{background:color-mix(in srgb,var(--gold) 14%,transparent)}

.sayfaBaslik,.emek,.sim .mw-body,.altbilgi{max-width:1220px;margin-left:auto;margin-right:auto}
.sayfaBaslik{margin-top:4px;margin-bottom:12px;font-size:18px;font-weight:700;color:var(--text);padding:0 2px}
.emek{padding:11px 14px;font-size:12.5px;color:var(--dim);background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:10px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.emek b{color:var(--text)} .emek a{color:var(--gold2);text-decoration:none} .emek a:hover{text-decoration:underline}

/* ana icerik: ana sayfadaki paneller gibi */
.sim .mw-body{margin-top:14px;margin-bottom:0;padding:6px 18px 22px;background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--gold);
  border-radius:12px;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.sim #firstHeading,.sim ul.subpage,.sim #toc,#language-selection{display:none!important}
.sim #mw-content-text,.sim-liste #mw-content-text{color:var(--text);margin:0}
.sim a,.sim-liste a{color:var(--gold2);text-decoration:none}
.sim a:hover,.sim-liste a:hover{color:#fff}
.sim p{margin:.5em 0}
.sim h2,.sim-liste h2{margin:22px 0 14px;padding:0;border:0;border-bottom:1px solid var(--line)!important;font:inherit}
.sim h2 .mw-headline{display:inline-block;padding:12px 4px;font:700 12px/1 ui-monospace,Consolas,monospace!important;letter-spacing:1.5px;text-transform:uppercase;
  color:var(--gold2)!important;border-bottom:2px solid var(--gold)}
.sim h3,.sim h4,.sim-liste h3{color:var(--gold2)!important;font:700 14px/1.3 system-ui,"Segoe UI",sans-serif!important;border:0!important;margin:6px 0 10px}
.sim h3 .mw-headline,.sim h4 .mw-headline{font:inherit!important;color:inherit!important}
.sim [style*="Quattrocento"]{font-family:Georgia,serif!important;color:var(--gold2)}
.sim p[style*="Quattrocento"][style*="text-align: right"]{font:12px system-ui,"Segoe UI",sans-serif!important;color:var(--faint)}
.sim p[style*="Quattrocento"][style*="text-align: right"] span[style]{color:var(--dim)}

/* uyari kutusu */
.sim [style*="#fee7e6"]{background:color-mix(in srgb,#e05a5a 12%,transparent)!important;border:1px solid color-mix(in srgb,#e05a5a 40%,transparent)!important;
  border-left:3px solid #e05a5a!important;border-radius:10px;color:var(--text)}

/* kutular (karakter listesi, karakter duzenleme, savas) */
.sim [style*="box-shadow"]:not(button):not(svg):not(img){box-shadow:none!important}
.sim [style*="solid black"],.sim [style*="black solid"],.sim [style*="black dashed"],.sim [style*="solid grey"],.sim [style*="grey solid"],
.sim [style*="#ccc solid"],.sim-liste [style*="black dashed"],.sim-liste [style*="solid black"]{border-color:var(--line)!important}
.sim [style*="border: 1px solid black"],.sim [style*="border: 1px black solid"]{background:var(--panel2);border-radius:12px}
.sim [style*="#e6d2a1"],.sim-liste [style*="#e6d2a1"]{background:var(--panel3)!important;color:var(--text);border:1px solid var(--line)}
.sim [style*="#e6d2a1"]:hover{border-color:var(--line2)}
.sim [style*="#f0f0f0"],.sim [style*="background: white"],.sim [style*="background-color: white"]{background:var(--input)!important;color:var(--text)}
.sim [style*="#d3d3d396"]{background:rgb(60 44 56 / .7)!important}
.sim [style*="rgba(0, 0, 0, 0.1)"],.sim [style*="rgba(0, 0, 0, .1)"]{background:var(--panel2)!important}
.sim [style*="rgba(0, 0, 0, 0.08)"],.sim [style*="rgba(0, 0, 0, .08)"]{background:rgb(255 255 255 / .04)!important}
.sim #attacker-trigger,.sim #victim-trigger{background:var(--panel2)!important;border:1px solid var(--line)!important;border-radius:12px;overflow:hidden;box-shadow:none!important}
.sim #attacker-trigger:hover,.sim #victim-trigger:hover{border-color:var(--gold)!important}
.sim #attacker-trigger svg path,.sim #victim-trigger svg path{fill:var(--faint)}

/* karakter listesi */
.sim #characters-container > *{border:1px solid var(--line)!important;background:var(--panel3)}
.sim #characters-container > *:hover{border-color:var(--line2)!important}
.sim #characters-container > .selected-character{border-color:var(--gold)!important;background:color-mix(in srgb,var(--gold) 14%,transparent)}
.sim .drop-zone{border:1px dashed var(--line2)!important;color:var(--dim);border-radius:var(--r)}
.sim .drop-zone:hover{border-color:var(--gold)!important;color:var(--gold2)}

/* form elemanlari */
.sim input:not([type=radio]):not([type=checkbox]):not([type=range]),.sim select,.sim textarea,
.sim-liste input:not([type=radio]):not([type=checkbox]),.sim-liste select{background:var(--input)!important;color:var(--text)!important;
  border:1px solid var(--line)!important;border-radius:6px!important;outline:none}
.sim input:focus,.sim select:focus,.sim-liste input:focus{border-color:var(--gold)!important}
.sim select option{background:var(--solid);color:var(--text)}
.sim input[type=checkbox]{background:var(--input);border:1px solid var(--line2);border-radius:6px}
.sim input[type=checkbox]:checked{background:var(--gold);border-color:var(--gold)}
.sim input:disabled,.sim [style*="rgba(239, 239, 239, 0.3)"]{background:rgb(18 12 18 / .35)!important;color:var(--faint)!important}

/* butonlar: ana sayfadaki bordo / altin */
.sim .brown,.sim-liste .brown,.sim button.brown{background:linear-gradient(180deg,var(--wine2),var(--wine))!important;color:#fff!important;border:1px solid #6c1626!important;border-radius:var(--r)!important}
.sim .brown:hover,.sim-liste .brown:hover{filter:brightness(1.12)}
.sim .brown > span:last-child,.sim .brown > div:last-child{background:rgb(0 0 0 / .18)!important}
.sim button#save-character{background:linear-gradient(180deg,#2f9e44,#25803a)!important;border-radius:var(--r)}
.sim button#save-character.unsaved-character{background:linear-gradient(180deg,#e3a008,#c27803)!important}
.sim .styled-button{background:var(--panel2);color:var(--dim);box-shadow:none;border:1px solid var(--line);font:600 13px system-ui,"Segoe UI",sans-serif;border-radius:var(--r)}
.sim .styled-button:hover{background:var(--panel3);color:var(--text);transform:none;box-shadow:none}
.sim .styled-button.tabber-active,.sim .styled-button:active{background:color-mix(in srgb,var(--gold) 12%,var(--panel))!important;color:var(--gold2)!important;border:1px solid var(--gold)!important}
.sim input[type='radio']:checked + img,.sim input[type='radio']:checked + .styled-button,
.sim .attacker-victim-selection input[type='radio']:checked + img{outline:2px solid var(--gold)!important;background:color-mix(in srgb,var(--gold) 12%,transparent)}
.sim input[type='radio']:hover + img{outline:1px solid var(--line2)}
.sim svg.svg-icon,.sim svg.svg-icon path,.sim .tooltip-icon svg,.sim .tooltip-icon svg path{fill:var(--dim)}
.sim svg.svg-icon:hover,.sim svg.svg-icon:hover path{fill:var(--gold2)}
.sim svg.svg-icon-delete:hover,.sim svg.svg-icon-delete:hover path{fill:#ec7378}

/* bilgi baloncuklari */
.sim .tooltip-info,.sim .tooltip-info-left{background:var(--solid)!important;color:var(--text);border:1px solid var(--line2)!important;border-radius:10px;box-shadow:var(--shadow)}
.sim .tooltip-info:after{border-bottom-color:var(--solid)!important;border-top-color:var(--solid)!important}
.sim .cadreFenetre{color:var(--text)}

/* acilir bolumler */
.sim .mw-collapsible-toggle{color:var(--text)}
.sim .improved-collapsible{border-color:var(--line)!important}

/* tablolar: ana sayfadaki liste basligi gibi */
.sim table,.sim td,.sim tr{background:transparent;color:var(--text);border-color:var(--line)!important}
.sim table.pretty-table{border-radius:10px;overflow:hidden;box-shadow:none!important;border:1px solid var(--line)}
.sim table.pretty-table th,.sim th{background:linear-gradient(180deg,color-mix(in srgb,var(--wine) 22%,var(--solid)),var(--solid))!important;color:var(--gold2)!important;
  font:700 12px Georgia,serif!important;letter-spacing:.4px;border-bottom:1px solid var(--line2)}
.sim table.pretty-table td{background:var(--panel2)}
.sim table.pretty-table tr:hover td{background:color-mix(in srgb,var(--wine) 10%,var(--panel2))}
.sim caption{color:var(--dim)}
.sim canvas{background:var(--input);border-radius:10px}
.sim kbd{background:var(--panel3);color:var(--text);border-color:var(--line)}
.sim hr{border:0;border-top:1px solid var(--line)}

/* pencereler (canavar / tas / silah secimi) */
.sim .modal{background:rgb(0 0 0 / .6)!important;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.sim [style*="#cbaa74"],.sim-liste [style*="#cbaa74"]{background:var(--solid)!important;color:var(--text);border:1px solid var(--line2);border-radius:14px!important;box-shadow:var(--shadow)}
.sim .close-button{filter:invert(.8)}

/* alt bilgi */
.altbilgi{margin-top:34px;padding:16px 10px 6px;border-top:1px solid var(--line);text-align:center;color:var(--faint);font-size:11.5px;line-height:1.6}
.altbilgi p{margin:0}

/* canavar / tas listesi (pencere icindeki sayfa) */
body.sim-liste{background:var(--solid)}
.sim-liste .monster-card{background:var(--panel2)!important;color:var(--text);border:1px solid var(--line)!important;border-radius:10px;overflow:hidden}
.sim-liste .monster-card:hover{border-color:var(--gold)!important}
.sim-liste .monster-card > div:first-child{background:color-mix(in srgb,var(--wine) 22%,#1a1218)!important;color:var(--gold2)}
.sim-liste .monster-card > div:first-child a,.sim-liste .monster-card > div:first-child span{color:var(--gold2)!important}
.sim-liste .monster-card [style*="border-radius: 50px"]{background:rgb(255 255 255 / .03)}
.sim-liste [style*="black dashed"]{border-style:solid!important;border-radius:5px}
.sim-liste [style*="background: white"],.sim-liste [style*="background-color: white"],.sim-liste [style*="#f0f0f0"]{background:var(--panel2)!important;color:var(--text)}
.sim-liste button,.sim-liste .button{background:var(--panel2)!important;color:var(--text)!important;border-color:var(--line)!important}
.sim-liste button svg path,.sim-liste .button svg path{fill:currentColor}
.sim-liste .handle-monster button{background:linear-gradient(180deg,var(--wine2),var(--wine))!important;color:#fff!important}
.sim-liste input{color:var(--text)}

/* kaydirma cubugu */
.sim ::-webkit-scrollbar,.sim-liste ::-webkit-scrollbar{width:10px;height:10px}
.sim ::-webkit-scrollbar-thumb,.sim-liste ::-webkit-scrollbar-thumb{background:#4b3e46;border-radius:6px;border:2px solid transparent;background-clip:padding-box}
.sim ::-webkit-scrollbar-track,.sim-liste ::-webkit-scrollbar-track{background:transparent}
:target{scroll-margin-top:20px}

@media (max-width:640px){
  .sarma{padding:12px}
  .sim .mw-body{padding:4px 12px 16px}
  .ust .logo b{font-size:18px}
}