:root{--cm-r-square:0;--cm-r-inset:4px;--cm-r-ctl:6px;--cm-r-card:12px;--cm-r-lg:16px;--bs-border-radius:var(--cm-r-ctl, 6px);--bs-border-radius-sm:var(--cm-r-ctl, 6px);--bs-border-radius-lg:var(--cm-r-ctl, 6px);--bs-card-border-radius:var(--cm-r-card, 12px);--bs-card-inner-border-radius:calc(var(--cm-r-card, 12px) - 1px);--bs-modal-border-radius:var(--cm-r-card, 12px)}body{margin:0;background:#10293f;font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding-top:40px}a{background:0 0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}img{border:0}button,input{font-family:inherit;font-size:100%;margin:0}button,input{line-height:normal}button{text-transform:none}button{-webkit-appearance:button;cursor:pointer}input[type=checkbox]{box-sizing:border-box;padding:0}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}*,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}body{font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;font-size:12px;line-height:1.428571429;color:#333;background-color:#fffffe}button,input{font-family:inherit;font-size:inherit;line-height:inherit}a{color:#4b80b4;text-decoration:none}a:focus,a:hover{color:#35587a;text-decoration:underline}a:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}img{vertical-align:middle}.row{margin-left:-15px;margin-right:-15px}.row:after,.row:before{content:" ";display:table}.row:after{clear:both}.row:after,.row:before{content:" ";display:table}.row:after{clear:both}.col-md-6{position:relative;min-height:1px;padding-left:15px;padding-right:15px}@media (min-width:992px){.col-md-6{float:left}.col-md-6{width:50%}}label{display:inline-block;margin-bottom:5px;font-weight:700}input[type=checkbox]{margin:4px 0 0;line-height:normal}input[type=checkbox]:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}.form-control{display:block;width:100%;height:31px;padding:6px 12px;font-size:12px;line-height:1.428571429;color:#555;vertical-align:middle;background-color:#fff;background-image:none;border:1px solid #ccc;border-radius:6px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}.form-control:focus{border-color:#66afe9;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)}.form-control:-moz-placeholder{color:#999}.form-control::-moz-placeholder{color:#999;opacity:1}.form-control:-ms-input-placeholder{color:#999}.form-control::-webkit-input-placeholder{color:#999}.form-group{margin-bottom:15px}.checkbox{display:block;min-height:17px;margin-top:10px;margin-bottom:10px;padding-left:20px;vertical-align:middle}.checkbox label{display:inline;margin-bottom:0;font-weight:400;cursor:pointer}.checkbox input[type=checkbox]{float:left;margin-left:-20px}.help-block{display:block;margin-top:5px;margin-bottom:10px;color:#737373}.form-horizontal .checkbox{margin-top:0;margin-bottom:0;padding-top:7px}.form-horizontal .checkbox{min-height:24px}.form-horizontal .form-group{margin-left:-15px;margin-right:-15px}.form-horizontal .form-group:after,.form-horizontal .form-group:before{content:" ";display:table}.form-horizontal .form-group:after{clear:both}.form-horizontal .form-group:after,.form-horizontal .form-group:before{content:" ";display:table}.form-horizontal .form-group:after{clear:both}.btn{display:inline-block;margin-bottom:0;font-weight:400;text-align:center;vertical-align:middle;cursor:pointer;background-image:none;border:1px solid transparent;white-space:nowrap;padding:6px 12px;font-size:12px;line-height:1.428571429;border-radius:6px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.btn:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}.btn:focus,.btn:hover{color:#333;text-decoration:none}.btn:active{outline:0;background-image:none;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.btn-default{color:#333;background-color:#fff;border-color:#ccc}.btn-default:active,.btn-default:focus,.btn-default:hover{color:#333;background-color:#ebebeb;border-color:#adadad}.btn-default:active{background-image:none}.btn-primary{color:#fff;background-color:#4b80b4;border-color:#42719e}.btn-primary:active,.btn-primary:focus,.btn-primary:hover{color:#fff;background-color:#3f6c97;border-color:#305273}.btn-primary:active{background-image:none}.input-group{position:relative;display:table;border-collapse:separate}.input-group .form-control{width:100%;margin-bottom:0}.input-group .form-control,.input-group-addon{display:table-cell}.input-group .form-control{border-radius:0;margin-left:-1px}.input-group-addon{width:1%;white-space:nowrap;vertical-align:middle}.input-group-addon{padding:6px 12px;font-size:12px;font-weight:400;line-height:1;color:#555;text-align:center;background-color:#eee;border:1px solid #ccc;border-radius:0}.input-group-addon:first-child{border-bottom-right-radius:0;border-top-right-radius:0}.input-group-addon:first-child{border-right:0}.input-group .form-control:last-child{border-bottom-left-radius:0;border-top-left-radius:0}.nav{margin-bottom:0;padding-left:0;list-style:none}.nav:after,.nav:before{content:" ";display:table}.nav:after{clear:both}.nav:after,.nav:before{content:" ";display:table}.nav:after{clear:both}.nav>li{position:relative;display:block}.nav>li>a{position:relative;display:block;padding:10px 15px}.nav>li>a:focus,.nav>li>a:hover{text-decoration:none;background-color:#eee}.nav-tabs{border-bottom:1px solid #ddd}.nav-tabs>li{float:left;margin-bottom:-1px}.nav-tabs>li>a{line-height:1.428571429;border:1px solid transparent;border-radius:6px 6px 0 0}.nav-tabs>li>a:hover{border-color:#eee #eee #ddd}.tab-content>.tab-pane{display:none}.tab-content>.active{display:block}.alert{padding:15px;margin-bottom:17px;border:1px solid transparent;border-radius:6px}.alert-danger{background-color:#f2dede;border-color:#ebccd1;color:#a94442}.panel{margin-bottom:17px;background-color:#fff;border:1px solid transparent;border-radius:6px;-webkit-box-shadow:0 1px 1px rgba(0,0,0,.05);box-shadow:0 1px 1px rgba(0,0,0,.05)}.panel-body{padding:15px}.panel-body:after,.panel-body:before{content:" ";display:table}.panel-body:after{clear:both}.panel-body:after,.panel-body:before{content:" ";display:table}.panel-body:after{clear:both}.panel-primary{border-color:#ccc}.clearfix:after,.clearfix:before{content:" ";display:table}.clearfix:after{clear:both}.center-block{display:block;margin-left:auto;margin-right:auto}.hidden{display:none!important;visibility:hidden!important}.visible-lg{display:none!important}@media (min-width:1200px){.visible-lg{display:block!important}}.hidden-xs{display:block!important}@media (max-width:767px){.hidden-xs{display:none!important}}.padder{height:50px}#allwrapper{color:#47475f;margin-right:auto;margin-left:auto;max-width:700px}#intro{text-align:center}#logindiv,#lostdiv,#registerdiv{padding-top:10px;max-width:300px}#logintab{max-width:400px}#s3slider{width:300px;height:250px;position:relative;overflow:hidden}#s3sliderContent{width:300px;position:absolute;top:0;margin-left:0;padding-left:0}.s3sliderImage{float:left;position:relative;display:none}.s3sliderImage span{position:absolute;left:0;font:12px/15px Arial,Helvetica,sans-serif;width:300px;background-color:#000;-moz-opacity:.7;-khtml-opacity:.7;opacity:.7;color:#fff;display:none;top:0;padding:10px 13px 10px 0}.tooltipContainer{background-position:left center;background-repeat:no-repeat;display:none;float:none;height:16px;padding:0 10px 0 20px}.form-group{margin-left:0!important;margin-right:0!important}.row{margin-left:0;margin-right:0}.alert{margin-bottom:10px}.intro-0,.intro-1,.intro-2,.intro-3{display:inline-block;background:url('https://www.canlioyun.net/themes/images/login.jpg') no-repeat;overflow:hidden;text-indent:-9999px;text-align:left}.intro-0{background-position:0 0;width:300px;height:250px}.intro-1{background-position:0 -250px;width:300px;height:250px}.intro-2{background-position:0 -500px;width:300px;height:250px}.intro-3{background-position:0 -750px;width:300px;height:250px}body{background:linear-gradient(150deg,#eef4fb 0,#e3ecf7 48%,#dbe7f4 100%);min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:28px 16px;box-sizing:border-box;color:#33475b}body:after,body:before{content:"";flex:1 1 0;min-height:0;width:0}body:after{flex-grow:3}.container-fluid{width:100%;padding-left:16px;padding-right:16px}.container-fluid>div{display:flex;justify-content:center;align-items:center}.container-fluid>div>div{flex:1 1 auto;width:100%;min-width:0;max-width:880px}body #tabno+.padder{display:none!important}#allwrapper{width:100%;max-width:880px;margin:0 auto;color:#33475b}#allwrapper>.card{border:0;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 30px 60px -26px rgba(16,41,63,.45),0 10px 24px -16px rgba(16,41,63,.22)}#allwrapper>.card>.card-body{display:flex;flex-wrap:wrap;align-items:stretch;padding:0}#allwrapper .card-body>div{flex:1 1 100%;width:100%;max-width:100%;min-width:0}@media (min-width:768px){#allwrapper .card-body>div:first-child{flex:0 0 44%;width:44%}#allwrapper .card-body>div:last-child{flex:0 0 56%;width:56%}}#allwrapper .card-body>div:first-child{--cm-intro-h:460px;background:linear-gradient(160deg,#111316 0,#0a0b0d 58%,#050607 100%);display:flex;align-items:stretch;justify-content:center;padding:26px 14px;min-height:var(--cm-intro-h)}#allwrapper .card-body>div:first-child:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 80% at 50% 0,rgba(255,255,255,.055) 0,rgba(255,255,255,0) 65%)}#allwrapper .card-body>div:first-child{position:relative}#intro{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%;text-align:center;min-height:calc(var(--cm-intro-h) - 52px)}#intro>br{display:none}#s3slider{width:100%;max-width:360px;aspect-ratio:6/5;height:auto;border-radius:16px;overflow:hidden;box-shadow:0 20px 36px -16px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.07)}#s3sliderContent{position:absolute;top:0;left:0;right:0;bottom:0;width:auto;height:auto;margin:0}#intro .s3sliderImage{width:100%;height:100%}#intro .intro-0,#intro .intro-1,#intro .intro-2,#intro .intro-3{display:block;width:100%;height:100%;background-size:100% 400%}#intro .intro-0{background-position:0 0}#intro .intro-1{background-position:0 33.3333%}#intro .intro-2{background-position:0 66.6667%}#intro .intro-3{background-position:0 100%}#intro>a{margin-top:auto;padding-bottom:2px;display:inline-flex;align-items:center;gap:7px;color:#9fc0e2;font-size:.8rem;font-weight:600;letter-spacing:.3px;text-decoration:none}#intro>a:focus,#intro>a:hover{color:#fff;text-decoration:none}#intro .s3sliderImage .s3sliderTitle{margin:0;font-size:0;line-height:0}#intro .s3sliderImage span{position:absolute;left:0;right:0;bottom:0;top:auto;width:auto;display:block!important;height:auto!important;margin:0!important;overflow:visible!important;background:linear-gradient(180deg,rgba(9,22,36,0) 0,rgba(9,22,36,.72) 52%,rgba(9,22,36,.94) 100%);color:#fff;font:600 12.5px/1.5 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;text-align:center;padding:28px 14px 13px}#allwrapper .card-body>div:last-child{padding:38px 40px 36px}@media (max-width:767px){#allwrapper .card-body>div:last-child{padding:26px 20px 24px}#allwrapper>.card{border-radius:16px}}@media (min-width:768px) and (max-width:860px){#allwrapper .card-body>div:first-child{padding:24px 0}#intro>a{margin-top:14px}}#logintab{display:flex;width:100%;max-width:360px;margin:0 auto 16px;padding:4px;gap:4px;background:#eef2f8;border:0;border-radius:12px}#logintab>li{float:none;flex:1 1 0;min-width:0;margin:0}#logintab>li>a{display:block;padding:.62rem .3rem;border:0!important;border-radius:6px;font-size:.8rem;font-weight:600;line-height:1.2;color:#61748a;white-space:nowrap;text-decoration:none}#logintab>li>a:focus,#logintab>li>a:hover{background:rgba(255,255,255,.7);color:#2f5f8f;text-decoration:none}#logintab>li>a.active,#logintab>li>a.active:focus,#logintab>li>a.active:hover{background:#fff;color:#2f5f8f;box-shadow:0 2px 8px rgba(16,41,63,.14)}#logintab>li>a:focus{outline:0}#logintab>li>a:focus-visible{outline:2px solid rgba(91,146,198,.85);outline-offset:2px}#logindiv,#lostdiv,#registerdiv{padding-top:0;max-width:360px;margin:0 auto}.form-group{margin-bottom:10px}#allwrapper .input-group{display:flex;flex-wrap:wrap;align-items:center;background:#fff;border:1px solid #dfe4ec;border-radius:12px;transition:border-color .15s ease,box-shadow .15s ease}#allwrapper .input-group:focus-within{border-color:#5b92c6;box-shadow:0 0 0 4px rgba(91,146,198,.16)}#allwrapper .input-group-addon{background:0 0;border:0!important;padding:0 10px 0 20px;width:auto;min-width:52px;color:#93a2b4;font-size:.9rem;line-height:1;display:flex;align-items:center;justify-content:center;white-space:nowrap}#allwrapper .input-group .form-control{flex:1 1 0;min-width:0;height:46px;margin-left:0;padding:0 20px 0 10px;border:0!important;border-radius:0!important;background:0 0!important;box-shadow:none!important;color:#22303f;font-size:.9rem;line-height:1.4}#allwrapper .input-group .form-control+.form-control{box-shadow:inset 1px 0 0 #e9edf3!important}#allwrapper #reg_firstname,#allwrapper #reg_lastname{flex:1 1 0;width:auto;min-width:0}#allwrapper #reg_lastname{flex-basis:82px}#allwrapper .input-group>.tooltipContainer{flex:0 0 100%;margin:0;padding:4px 0 0 14px;color:#c0392b;font-size:.75rem}#allwrapper .form-control::placeholder{color:#9aa7b6;opacity:1}#allwrapper .checkbox{display:block;margin:10px 0 12px;padding:0 0 0 26px;min-height:0}#allwrapper .checkbox label{display:inline;margin:0;font-size:.85rem;font-weight:500;color:#4c5c70;cursor:pointer}#allwrapper .checkbox input[type=checkbox]{float:left;margin:3px 0 0 -26px;width:17px;height:17px;accent-color:#4B80B4;cursor:pointer}#allwrapper .checkbox>a{display:block;margin:4px 0 0;font-size:.8rem;color:#5b7fa6;text-decoration:none}#allwrapper .checkbox>a .form-text{display:inline;margin:0;font-size:inherit;color:inherit}#allwrapper .checkbox>a:focus,#allwrapper .checkbox>a:hover{color:#3f668f;text-decoration:underline}#allwrapper form>.form-text{margin:11px 0 14px;font-size:.8rem;line-height:1.45;color:#7c8b9d}#allwrapper .card-body>div:last-child{display:flex;flex-direction:column}#allwrapper .tab-content{display:flex;flex-direction:column;flex:1 1 auto;min-height:0}#allwrapper .tab-content>.tab-pane.active{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;width:100%}#allwrapper .tab-content>.tab-pane.active>form{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;width:100%}#allwrapper .tab-content>.tab-pane.active>form>.checkbox{margin-top:0}#allwrapper #loginform>.form-group:first-of-type{margin-top:30px}#allwrapper #loginform>.checkbox{margin-top:5px}#allwrapper #logindiv:has(#login_message:not(:empty)) #loginform>.form-group:first-of-type{margin-top:0}#allwrapper #lostform>.input-group{margin-top:30px}#allwrapper .btn-row{margin-top:auto;padding-top:22px;display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;justify-content:flex-start}#allwrapper .btn-row .btn-primary{flex:1 1 auto}#allwrapper #lostform>.btn,#allwrapper #registerForm>.btn{margin-top:auto}#allwrapper form>br{display:none}#allwrapper .btn{height:46px;padding:0 22px;border:0;border-radius:12px;font-size:.9rem;font-weight:600;line-height:1;vertical-align:bottom;transition:transform .12s ease,box-shadow .16s ease,background .16s ease,color .16s ease,border-color .16s ease}#allwrapper .btn:active{transform:translateY(1px)}#allwrapper .btn+.btn{margin-left:12px}#allwrapper .btn-row .btn+.btn{margin-left:0}#allwrapper .btn:focus{outline:0}#allwrapper .btn:focus-visible{outline:2px solid rgba(91,146,198,.85);outline-offset:2px}#allwrapper .btn-primary{height:52px;min-width:170px;padding:0 34px;font-size:1rem;border-radius:12px;background:linear-gradient(135deg,#5b92c6 0,#3f6d99 100%);color:#fff;box-shadow:0 16px 28px -14px rgba(63,109,153,.95)}#allwrapper .btn-primary:focus,#allwrapper .btn-primary:hover{background:linear-gradient(135deg,#4f86bc 0,#37628c 100%);color:#fff;box-shadow:0 18px 32px -14px #3f6d99}#allwrapper .btn-warning{height:38px;padding:0 16px;border:1px solid #dbe3ec;border-radius:12px;background:0 0;color:#6d8098;font-size:.8rem;font-weight:500;box-shadow:none}#allwrapper .btn-warning:active,#allwrapper .btn-warning:focus,#allwrapper .btn-warning:hover{background:#f4f8fc;border-color:#c6d6e6;color:#3f668f}#allwrapper .alert{border:0;border-radius:12px;padding:11px 14px;margin-bottom:14px;font-size:.85rem;line-height:1.5}#login_message:empty,#lost_message:empty,#status:empty{display:none}#login_message{max-width:360px;width:100%;margin:0 auto}body.dark-mode{background:linear-gradient(150deg,#1b2430 0,#151d26 60%,#111820 100%);color:#dfe3e8}body.dark-mode #allwrapper{color:#dfe3e8}body.dark-mode #allwrapper>.card{background:#2a2f37;box-shadow:0 30px 60px -26px rgba(0,0,0,.75)}body.dark-mode #logintab{background:#242a32}body.dark-mode #logintab>li>a{color:#9aa3ad}body.dark-mode #logintab>li>a:focus,body.dark-mode #logintab>li>a:hover{background:rgba(255,255,255,.06);color:#cdddf2}body.dark-mode #logintab>li>a.active{background:#333a44;color:#8ab4f8}body.dark-mode #allwrapper .input-group{background:#242a32;border-color:#3c434c}body.dark-mode #allwrapper .input-group .form-control{color:#dfe3e8}body.dark-mode #allwrapper .input-group .form-control+.form-control{box-shadow:inset 1px 0 0 #3c434c!important}body.dark-mode #allwrapper .checkbox label{color:#c7ced6}body.dark-mode #allwrapper .btn-warning{background:0 0;border-color:#454d58;color:#9aa3ad}body.dark-mode #allwrapper .btn-warning:active,body.dark-mode #allwrapper .btn-warning:focus,body.dark-mode #allwrapper .btn-warning:hover{background:#242a32;border-color:#566070;color:#cdddf2}#allwrapper .google-signin{margin-top:12px;padding-top:12px;border-top:1px solid #e3e9f0}#allwrapper #google_signin{width:100%;max-width:100%;min-height:40px}#allwrapper #google_signin iframe{display:block;margin:0 auto}#allwrapper .google-signin.google-signin-failed{display:none}body.dark-mode #allwrapper .google-signin{border-top-color:#3c434c}/* =====================================================================
   Chess Moon — Dark theme layer  (themes/sources/dark.css)
   ---------------------------------------------------------------------
   This file ONLY acts under `body.dark-mode` (set by includes/templates.php
   when the player preference `background = dark`).  Light mode is untouched.

   It is appended AFTER common.css in every page bundle (see _create.php),
   so `body.dark-mode <sel>` rules win over the plain component rules of
   common.css/Bootstrap.

   Design tokens: `--cm-*` are defined here with light defaults on :root and
   dark values on body.dark-mode.  Page-level inline <style> blocks that use
   var(--cm-*) automatically adapt to the theme without fighting specificity.
   ===================================================================== */

/* ---------------------------- Light defaults ---------------------------- */
/* --cm-* acik degerleri themes/sources/common.css icindeki :root'tadir;
   dark.css yalnizca body.dark-mode altinda koyu degerleri uygular. */

/* ----------------------------- Dark values ------------------------------ */
body.dark-mode {
  color-scheme: dark;
  --cm-bg: #20242b;
  --cm-surface: #2a2f37;
  --cm-surface-2: #333a44;
  --cm-surface-3: #3a414d;
  /* .btn-secondary dolgusu (acik modda cok acik gri): koyu modda "acik"
     karsiligi yuzeyden bir ton acik grilerdir. */
  --cm-btn-2-bg: #333a44;
  --cm-btn-2-bg-hover: #3a414d;
  --cm-btn-2-bg-active: #434b57;
  --cm-border: #3c434c;
  --cm-border-strong: #454d58;
  --cm-text: #dfe3e8;
  --cm-muted: #9aa3ad;
  --cm-muted-2: #a7afb9;
  --cm-clock-idle: #9aa3ad;
  --cm-link: #8ab4f8;
  --cm-primary: #4B80B4;
  --cm-primary-dark: #8ab4f8;
  --cm-primary-bg: #2c3a4b;
  --cm-footer-bg: #171a1f;
  --cm-footer-text: #c7ced6;
  --cm-success: #6faf6a;
  --cm-success-dark: #86d69a;
  --cm-danger: #e2604f;
  --cm-del-ico: #e0837a;
  --cm-del-ico-h: #f09a8c;
  --cm-warning-bg: #4a4020;
  --cm-board-bg: #2a2f37;
  --cm-border-soft: #3c434c;
  --cm-box-border: #3c434c;
  --cm-on-accent: #ffffff;
  --cm-accent-fill: #36557a;
  --cm-accent-fill-hover: #2c4668;
  --cm-header-bg: #36557a;
  --cm-header-border: #45658a;
  --cm-chat-head: #b26a1d;
  --cm-chat-blink: #125a74;
  --cm-zeitnot-bg: rgba(224, 60, 60, 0.24);
  --cm-onmove: #ff9d9d;
  --cm-brand-text: #9fc3ea;
  --cm-mark-grey: rgba(160, 167, 178, 0.18);
  --cm-mark-orange: rgba(255, 193, 7, 0.16);
  --cm-mark-red: rgba(220, 53, 69, 0.22);
  --cm-mark-red-soft: rgba(220, 53, 69, 0.18);
  --cm-mark-green: rgba(46, 160, 93, 0.18);
  --cm-mark-blue: rgba(75, 128, 180, 0.22);
  --cm-mark-grey-h: rgba(160, 167, 178, 0.3);
  --cm-mark-orange-h: rgba(255, 193, 7, 0.3);
  --cm-mark-red-h: rgba(220, 53, 69, 0.35);
  --cm-mark-green-h: rgba(46, 160, 93, 0.32);
  --cm-mark-blue-h: rgba(75, 128, 180, 0.34);
  --cm-mark-hover-text: #ffffff;
  --cm-alert-info-bg: #243140;
  --cm-alert-info-border: #36557a;
  --cm-alert-info-text: #cfe0f2;
  --cm-alert-warning-bg: rgba(255, 196, 60, 0.13);
  --cm-alert-warning-border: rgba(255, 196, 60, 0.33);
  --cm-alert-warning-text: #e9cd86;
  --cm-border-grey: #3c434c;
  --cm-chat-text: #dfe3e8;
  --cm-chat-info: #9aa3ad;
}

/* ============================ Global ============================ */
body.dark-mode {
  background-color: var(--cm-bg);
  color: var(--cm-text);
}
body.dark-mode a { color: var(--cm-link); }
body.dark-mode a:hover { color: #a9c9f5; }

body.dark-mode hr,
body.dark-mode .dropdown-divider { border-color: var(--cm-border); }

body.dark-mode footer {
  background: var(--cm-footer-bg);
  color: var(--cm-footer-text);
}

/* ============================ Surfaces ============================ */
body.dark-mode .card,
body.dark-mode .box,
body.dark-mode .card-body {
  background-color: var(--cm-surface);
  color: var(--cm-text);
  border-color: var(--cm-border);
}
body.dark-mode .card-header {
  border-bottom-color: var(--cm-border);
}

body.dark-mode .cfg-side-menu .card-header {
  background-color: #36557a;
  border-bottom-color: #4a6b92;
  color: #dfe7f1;
}
body.dark-mode .cfg-side-menu .card-header a { color: #dfe7f1 !important; }
body.dark-mode .cfg-side-menu .card-header .cfg-ico {
  background-color: rgba(255, 255, 255, 0.92);
  color: #36557a;
}

/* ============================ Bootstrap components ============================ */
/* Modal / dropdown / popover / tooltip */
body.dark-mode .modal-content,
body.dark-mode .dropdown-menu,
body.dark-mode .popover {
  background-color: var(--cm-surface);
  color: var(--cm-text);
  border-color: var(--cm-border);
}
body.dark-mode .modal-header,
body.dark-mode .modal-footer,
body.dark-mode .popover-header,
body.dark-mode .popover-body {
  border-color: var(--cm-border);
  color: var(--cm-text);
}
/* Popover basligi (zil/bildirim gibi): Bootstrap varsayilani #f0f0f0 acik
   zemindi; metni acik yaptigimiz icin okunmuyordu -> zemini de koyu yap. */
body.dark-mode .popover-header {
  background-color: var(--cm-surface-2);
}
body.dark-mode .modal-header { background-color: var(--cm-surface); }
body.dark-mode .dropdown-item { color: var(--cm-text); }
body.dark-mode .dropdown-item:hover,
body.dark-mode .dropdown-item:focus { background-color: var(--cm-surface-3); color: #fff; }
body.dark-mode .dropdown-item.active,
body.dark-mode .dropdown-item:active { background-color: var(--cm-primary); color: #fff; }
body.dark-mode .btn-close { filter: invert(1) grayscale(100%); }
body.dark-mode .tooltip-inner { background-color: #000; }

/* List group */
body.dark-mode .list-group-item {
  background-color: var(--cm-surface);
  color: var(--cm-text);
  border-color: var(--cm-border);
}
body.dark-mode .list-group-item:hover { background-color: var(--cm-surface-3); }
body.dark-mode .list-group-item.active {
  background-color: var(--cm-primary-bg);
  border-color: var(--cm-border);
  border-left-color: var(--cm-link);
  color: var(--cm-primary-dark);
}
body.dark-mode .list-group-item.active a { color: var(--cm-primary-dark); }

/* Tables */
body.dark-mode .table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--cm-text);
  --bs-table-striped-color: var(--cm-text);
  --bs-table-hover-color: var(--cm-text);
  color: var(--cm-text);
  border-color: var(--cm-border);
}
body.dark-mode .table thead th,
body.dark-mode .table th,
body.dark-mode .table td {
  border-color: var(--cm-border);
  background-color: transparent;
}
body.dark-mode .table-hover > tbody > tr:hover,
body.dark-mode .table-hover > tbody > tr:hover > * {
  --bs-table-accent-bg: rgba(255, 255, 255, 0.045);
  background-color: rgba(255, 255, 255, 0.045);
}
body.dark-mode .table-striped > tbody > tr:nth-of-type(odd),
body.dark-mode .table-striped > tbody > tr:nth-of-type(odd) > * {
  --bs-table-accent-bg: rgba(255, 255, 255, 0.035);
  --bs-table-color-type: var(--cm-text);
  background-color: rgba(255, 255, 255, 0.035);
  color: var(--cm-text);
}
body.dark-mode .table > :not(caption) > * > * {
  color: var(--bs-table-color-type, var(--cm-text));
}
body.dark-mode .table-light,
body.dark-mode .table-light > th,
body.dark-mode .table-light > td {
  background-color: var(--cm-surface-2);
  color: var(--cm-text);
}
body.dark-mode .table-secondary { --bs-table-bg: #333a44; --bs-table-color: var(--cm-text); }

/* Forms */
body.dark-mode .form-control,
body.dark-mode select.form-control,
body.dark-mode .form-select,
body.dark-mode textarea.form-control,
body.dark-mode .input-group-text {
  background-color: var(--cm-surface-2);
  color: var(--cm-text);
  border-color: var(--cm-border-strong);
}
body.dark-mode .form-control:focus,
body.dark-mode .form-select:focus {
  background-color: var(--cm-surface-2);
  color: var(--cm-text);
}
body.dark-mode .form-control::placeholder { color: var(--cm-muted-2); }
body.dark-mode .form-check-input { background-color: var(--cm-surface-2); border-color: var(--cm-border-strong); }
body.dark-mode .form-check-input:checked { background-color: var(--cm-primary); border-color: var(--cm-primary); }
body.dark-mode select.form-control option,
body.dark-mode .form-select option { background-color: var(--cm-surface); color: var(--cm-text); }

/* Buttons that are light by default */
/* .btn-secondary dolgusu/kenarligi artik common.css'teki --cm-btn-2-bg /
   --cm-border-strong tokenlariyla tanimli (acik modda cok acik gri, koyu modda
   --cm-surface-2 karsiligi; degerler yukaridaki body.dark-mode blogunda). Burada
   yalnizca <a> uzerindeki yazi rengi korunur: `body.dark-mode a` / `a:hover`
   (0,2,1 / 0,2,2) etiketi mavi #8ab4f8/#a9c9f5 yapmasin (bkz. .btn-warning dersi). */
body.dark-mode .btn-secondary { color: var(--cm-text); }
body.dark-mode .btn-secondary:hover,
body.dark-mode .btn-secondary:focus,
body.dark-mode .btn-secondary:active { color: var(--cm-text); }
body.dark-mode .btn-secondary:disabled,
body.dark-mode .btn-secondary.disabled { color: var(--cm-muted); }

/* cfg-page icindeki .btn-secondary cfg kimligini korur: metin --cfg-primary-dark,
   hover birincil dolgu uzerinde beyaz. (0,3,1)/(0,4,1) ile yukaridaki genel
   body.dark-mode .btn-secondary (0,2,1)/(0,3,1) kurallarini asar. */
body.dark-mode .cfg-page .btn-secondary { color: var(--cfg-primary-dark); }
body.dark-mode .cfg-page .btn-secondary:hover,
body.dark-mode .cfg-page .btn-secondary:focus,
body.dark-mode .cfg-page .btn-secondary:active { color: #fff; }

body.dark-mode .btn-light {
  background-color: #454d58;
  border-color: #55606e;
  color: #e6e9ed;
}
body.dark-mode .btn-light:hover {
  background-color: #535e6c;
  border-color: #64707f;
  color: #fff;
}
/* btn-warning (marka sarisi) - body.dark-mode a link rengi (mavi #8ab4f8)
   .btn-warning yazisini eziyordu; okunur koyu metin garantile. */
body.dark-mode .btn-warning {
  color: #222;
}
body.dark-mode .btn-warning:hover,
body.dark-mode .btn-warning:focus,
body.dark-mode .btn-warning:active {
  color: #222;
}
body.dark-mode .btn-outline-secondary { color: #c2cad3; border-color: #55606e; }
body.dark-mode .btn-outline-secondary:hover { background-color: #454d58; color: #fff; }

/* Solid yesil/birincil dugmelerin koyu modda okunur kalmasini garantile */
body.dark-mode .btn-success {
  background-color: #3a7d46 !important;
  border-color: #3a7d46 !important;
  color: #fff !important;
}
body.dark-mode .btn-success:hover,
body.dark-mode .btn-success:focus {
  background-color: #2f6b3a !important;
  border-color: #2f6b3a !important;
  color: #fff !important;
}
body.dark-mode .btn-primary,
body.dark-mode .btn-danger {
  color: #fff !important;
}
body.dark-mode .btn-primary:hover,
body.dark-mode .btn-danger:hover {
  color: #fff !important;
}

/* Close / text helper colours */
body.dark-mode .text-dark { color: var(--cm-text) !important; }
body.dark-mode .text-body { color: var(--cm-text) !important; }
body.dark-mode .bg-white,
body.dark-mode .bg-light { background-color: var(--cm-surface-2) !important; }
body.dark-mode .bg-dark { background-color: #14171c !important; }
body.dark-mode .text-black-50 { color: var(--cm-muted) !important; }

/* ============================ common.css components ============================ */
/* Generic "box" white panel & walls */
body.dark-mode .box,
body.dark-mode #wall > li {
  background-color: var(--cm-surface);
  border-color: var(--cm-border);
  color: var(--cm-text);
}
body.dark-mode .brd { border-bottom-color: var(--cm-border); }

/* Comment areas */
body.dark-mode .c_area_commentary,
body.dark-mode #comment_text {
  background-color: var(--cm-surface-2);
  border-bottom-color: var(--cm-border);
  color: var(--cm-muted);
}
body.dark-mode .commentary_text {
  background-color: var(--cm-surface);
  color: var(--cm-text);
}
body.dark-mode .c_main,
body.dark-mode .comments { color: var(--cm-muted); }

/* Pagination (.page) */
body.dark-mode .page a {
  color: var(--cm-link);
  background: var(--cm-surface);
  border-color: var(--cm-border);
}
body.dark-mode .page a:hover {
  background: var(--cm-primary);
  border-color: var(--cm-primary);
  color: #fff;
}
body.dark-mode .page span.emphasis {
  background: var(--cm-primary);
  border-color: var(--cm-primary);
  color: #fff;
}

/* Chat popups — zemin/kenarlik/metin artik --cm-* token'larindan geliyor. */
body.dark-mode .chatboxtextareaselected { border-color: #d98a2b; }

/* Sticky notes */
body.dark-mode .sticky-queue {
  background: var(--cm-surface);
  border-color: var(--cm-border-strong);
  color: var(--cm-text);
}
body.dark-mode .sticky { color: var(--cm-text); }
body.dark-mode .border-top-right, body.dark-mode .border-bottom-right,
body.dark-mode .border-top-left, body.dark-mode .border-bottom-left,
body.dark-mode .border-top-center, body.dark-mode .border-bottom-center {
  border-color: var(--cm-border);
}

/* Row "mark" zeminleri artik --cm-mark-* token'larindan geliyor (common.css).
   Asagida yalnizca mark a.btn sinir/metin ezmeleri kalir. */
body.dark-mode .markgrey a.btn,
body.dark-mode .markorange a.btn,
body.dark-mode .markred a.btn,
body.dark-mode .markgreen a.btn,
body.dark-mode .markblue a.btn {
  border-color: rgba(255, 255, 255, 0.18) !important;
  color: var(--cm-text) !important;
}
body.dark-mode .markred a.btn { border-color: rgba(230, 90, 110, 0.55) !important; }

/* Selectors (#sel, #game_type_sel, time controls) */
body.dark-mode #game_type_sel label > span,
body.dark-mode #game_type_sel2 label > span {
  background-color: var(--cm-surface);
  border-color: var(--cm-border);
  color: var(--cm-text);
}
body.dark-mode #sel label > input:checked + span,
body.dark-mode #total_time_limit_sel label > input:checked + span,
body.dark-mode #game_type_sel label > input:checked + span,
body.dark-mode #game_type_sel2 label > input:checked + span {
  background-color: #38455c;
  color: var(--cm-text);
}
/* Koyu modda da hover gorunur olsun (common.css'teki hover kuralindan daha
   ozgul: burada .dark-mode + :hover var; secili pill'i yine ezmez). */
body.dark-mode #game_type_sel label:hover > span,
body.dark-mode #game_type_sel2 label:hover > span {
  background-color: var(--cm-accent-fill);
  border-color: var(--cm-accent-fill);
  color: #fff;
}

/* Invitation card */
body.dark-mode .invite-card {
  background-color: var(--cm-surface);
  border-color: var(--cm-border);
  color: var(--cm-text);
}
body.dark-mode .invite-avatar { background-color: var(--cm-surface-2); color: var(--cm-muted); }
body.dark-mode .invite-badge { background-color: var(--cm-warning-bg); color: var(--cm-text); }
body.dark-mode .invite-info-item { color: var(--cm-muted); }
body.dark-mode .invite-info-item b { color: var(--cm-text); }
body.dark-mode .invite-card-section,
body.dark-mode .game-actions-row { border-top-color: var(--cm-border); }

/* Game / board area */
body.dark-mode .game-panel { color: var(--cm-text); }
body.dark-mode .clock-panel .clock-time { color: var(--cm-text); }
body.dark-mode .clock-panel:has(.clock-time.onmove) {
  box-shadow: inset 0 0 0 2px #3b82f6;
  background: #1e2b3f;
}

/* Son 20 saniye: alarm rengi koyu temada biraz daha parlak kirmizi (koyu
   zeminde #c1121f boguluyordu); metin beyaz kalir. */
body.dark-mode .clocks-container .clock-panel.zeitnot-alarm,
body.dark-mode #mobile_clock_row .mcr-time.zeitnot-alarm {
  background: #d32f2f;
  box-shadow: inset 0 0 0 2px #ff8a80;
}
body.dark-mode .clocks-container .clock-panel.zeitnot-alarm .clock-time,
body.dark-mode .clocks-container .clock-panel.zeitnot-alarm .clock-frac,
body.dark-mode #mobile_clock_row .mcr-time.zeitnot-alarm span {
  color: #fff;
}

/* Notation (hamle listesi): hamle numaralari duz metin olup kaynak
   #notation_html{color:#253989} koyu lacivert idi. Artik base kural --cm-muted
   tokeni kullandigi icin numaralar her temada adaptif muted; hamleler link rengi. */
body.dark-mode #notation_html a.gameMove { color: var(--cm-link); }

/* Mini tahta oynatma dugmeleri (#board-buttons) koyu gorunum */
body.dark-mode #board-buttons button {
  color: #dfe3e8;
  background-color: #2a2f37;
  border-color: #454d58;
}
body.dark-mode #board-buttons button:hover,
body.dark-mode #board-buttons button:focus {
  background-color: #333a44;
}


/* Board containers with inline white background are overridden here. */
body.dark-mode #board,
body.dark-mode #boardmaincontainer {
  background-color: #2a2f37 !important;
}

/* Promotion picker (#promotion): koyu temada #boardmaincontainer (#2a2f37)
   ile ayni tona dusmesin diye bir ton acik yuzey + belirgin kenarlik/golge.
   Hover vurgusu da tema ile uyumlu acik bir zemin alir. */
body.dark-mode #promotion {
  background: #333a44;
  border-color: #4a5462;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45);
}
body.dark-mode #promotion a:hover,
body.dark-mode #promotion a:focus-visible {
  background: #3e4855;
  box-shadow: inset 0 0 0 1.5px #56647a;
}

/* Board coordinate gutter labels on the dark board background */
body.dark-mode .cm-coord {
  color: #aab3bf;
  text-shadow: none;
}

/* Game info / H2H / PGN */
body.dark-mode .game-info-vs { background: var(--cm-surface-2); color: var(--cm-muted); }
body.dark-mode .game-info-list { border-color: var(--cm-border); }
body.dark-mode .game-info-list li { border-bottom-color: var(--cm-border); }
body.dark-mode .game-info-list li:nth-child(odd) { background: rgba(255, 255, 255, 0.03); }
body.dark-mode .game-info-icon { background: var(--cm-surface-2); color: #9cc0e8; }
body.dark-mode .guest-match-subtitle { color: var(--cm-muted); }
body.dark-mode .h2h-panel {
  background: rgba(255, 255, 255, 0.03);
  border-color: var(--cm-border);
}
body.dark-mode .h2h-row + .h2h-row { border-top-color: var(--cm-border); }
body.dark-mode .pgn-text {
  background: #1b1f26;
  border-color: var(--cm-border);
  color: var(--cm-text);
}

/* Game result card */
body.dark-mode #game_result:has(.game-result-message) {
  border-color: var(--cm-border);
  background: linear-gradient(180deg, #262c35 0%, #22272f 100%) !important;
  color: var(--cm-text);
}
body.dark-mode #game_result .game-result-outcome { color: #eef1f5; }
body.dark-mode #game_result .game-result-reason {
  background: rgba(150, 170, 210, 0.16);
  color: #b7c4d8;
}
body.dark-mode #game_result .game-result-rating { border-top-color: var(--cm-border); }
body.dark-mode #game_result .game-result-rating-neutral { color: #a7afb9; }
body.dark-mode #game_result .game-result-rating-up { color: #6fd18f; }
body.dark-mode #game_result .game-result-rating-down { color: #ff8f7a; }
body.dark-mode #game_result .game-result-rated-on {
  background: rgba(255, 196, 60, 0.15);
  color: #e9cd86;
}
body.dark-mode #game_result .game-result-rated-off {
  background: rgba(150, 170, 210, 0.16);
  color: #b7c4d8;
}

/* Resign / draw buttons */
body.dark-mode .resign-confirm {
  border-color: #6a3f43;
  background: #30282a;
  color: var(--cm-text);
}
body.dark-mode .resign-confirm:hover { background: #3a2b2e; }
body.dark-mode .btn-resign {
  background: #332629;
  color: #ff9d90;
  border-color: #7a4650;
}
body.dark-mode .btn-resign:hover,
body.dark-mode .btn-resign:focus { background: #452e33; color: #ffb3a9; border-color: #a5525e; }
body.dark-mode .btn-draw {
  background: #333a44;
  color: #d4d9e0;
  border-color: #454d58;
}
body.dark-mode .btn-draw:hover,
body.dark-mode .btn-draw:focus { background: #3d4550; color: #fff; border-color: #56606c; }

/* Board toolbar */
body.dark-mode .board-toolbar .board-tool-btn { color: #c6cdd6; }
body.dark-mode .board-toolbar .board-tool-btn:hover,
body.dark-mode .board-toolbar .board-tool-btn:focus {
  background: var(--cm-surface-2);
  color: #fff;
}

/* Waiting-for-opponent banner */
body.dark-mode #online_info_box:has(#waited_time:not(.hidden)),
body.dark-mode #online_info_box:has(#sides_online_info:not(.d-none)) {
  border-color: #6a3f43;
  background: linear-gradient(180deg, #3a2525 0%, #322020 100%);
}
body.dark-mode #online_info_box #sides_online_info { color: #eec2bc; }

/* Tournament / misc */
body.dark-mode .tourn-info-desc,
body.dark-mode .tourn-info-founder,
body.dark-mode .tourn-info-actions {
  border-color: var(--cm-border);
  color: var(--cm-muted);
}
body.dark-mode .tournament-desc { color: var(--cm-muted); }
body.dark-mode .tournament-start-date { color: var(--cm-muted); }

/* ============================ cfg-page (custom settings UI) ============================ */
/* configure.php / mainmenu.php cfg panels: their inline <style> uses --cfg-*
   variables (set here dark) plus a few hard-coded light fills.  The hard-coded
   fills are neutralised below by re-declaring them with higher specificity
   (these selectors are also written in the page inline style, so we need the
   extra `body.dark-mode` prefix AND the same descendant path — see note). */
body.dark-mode .cfg-page {
  --cfg-text: #e8eaed;
  --cfg-muted: #a7afb9;
  --cfg-border: #3c434c;
  --cfg-bg: #20242b;
  --cfg-card: #2a2f37;
  --cfg-primary: #4c7eaf;
  --cfg-primary-dark: #8ab4f8;
  --cfg-primary-light: #74a0cf;
  --cfg-header-bg: #303b48;
  --cfg-header-border: #3e4c5e;
  --cfg-header-text: #cdddf2;
  --cfg-sidemenu-header-bg: #34445a;
  --cfg-sidemenu-header-border: #45607f;
}
body.dark-mode .cfg-page .card-header {
  background: #303b48;
  border-bottom-color: #3e4c5e;
  color: #cdddf2;
}
body.dark-mode .cfg-page .card-header .cfg-ico,
body.dark-mode .cfg-page .cfg-side-menu .card-header .cfg-ico {
  background: rgba(255, 255, 255, 0.9);
  color: #4c7eaf;
}
/* Uyari banner'i ikon cipi (.cm-alert-icon, common.css): card-header .cfg-ico
   standardinin koyu mod karsiligi - cip acik kalir, ikon marka mavisi olur. */
body.dark-mode .cm-alert-icon > .cm-alert-ico {
  background: rgba(255, 255, 255, 0.9);
  color: #4c7eaf;
}
body.dark-mode .cfg-page .cfg-side-menu .card-header {
  background: #34445a;
  color: #d7e6f8;
  border-bottom-color: #45607f;
}
body.dark-mode .cfg-page .form-check-inline {
  background: var(--cfg-bg);
  border-color: var(--cfg-border);
}
body.dark-mode .cfg-page .cfg-toggle { background: #1b1f26; }
body.dark-mode .cfg-page .cfg-dropzone { background: #20242b; }
body.dark-mode .cfg-page .cfg-dropzone:hover { background: #262c35; }
body.dark-mode .cfg-page .cfg-dropzone input[type="file"] {
  background: #333a44;
  border-color: var(--cfg-border);
  color: var(--cfg-text);
}
body.dark-mode .cfg-page .badge-soft { background: #303b48; color: #c3d7ef; }
body.dark-mode .cfg-page label.col-form-label { color: #c7cfd9; }
body.dark-mode .cfg-page .form-text { color: var(--cfg-muted); }
body.dark-mode .cfg-page #notationtab .nav-link.active {
  background: #3a4554;
  color: #cdddf2;
}
body.dark-mode .cfg-page .list-group-item:hover,
body.dark-mode .cfg-page #notationtab .list-group-item:hover { background: #333a44; }
body.dark-mode .cfg-page .cfg-stat {
  background: #333a44;
  border-color: var(--cfg-border);
  box-shadow: none;
}

/* ============================ Scrollbars ============================ */
body.dark-mode *::-webkit-scrollbar-track { background: #1c2027; }
body.dark-mode *::-webkit-scrollbar-thumb { background: #454d58; }
body.dark-mode *::-webkit-scrollbar-thumb:hover { background: #56606c; }

/* ============================ Alerts ============================ */
body.dark-mode .alert-danger {
  background-color: rgba(220, 53, 69, 0.16);
  border-color: rgba(220, 53, 69, 0.35);
  color: #ffb3ac;
}
body.dark-mode .alert-success {
  background-color: rgba(46, 160, 93, 0.15);
  border-color: rgba(46, 160, 93, 0.32);
  color: #8fd8a9;
}
body.dark-mode .alert-secondary,
body.dark-mode .alert-light {
  background-color: #333a44;
  border-color: #454d58;
  color: #dfe3e8;
}
body.dark-mode .alert { border-radius: 6px; }

/* ============================ MagicSuggest (player search) ============================ */
body.dark-mode .ms-ctn {
  background: #333a44;
  border-color: #454d58;
  color: var(--cm-text);
}
body.dark-mode .ms-ctn-focus,
body.dark-mode .ms-ctn.ms-ctn-focus {
  border-color: #4c7eaf;
  box-shadow: 0 0 0 0.2rem rgba(76, 126, 175, 0.15);
}
body.dark-mode .ms-ctn .ms-sel-ctn .ms-sel-item {
  background: #3a4554;
  border: 1px solid #4a5a6e;
  color: #cdddf2;
}
body.dark-mode .ms-ctn .ms-sel-ctn .ms-sel-text,
body.dark-mode .ms-ctn .ms-txt {
  color: var(--cm-text);
}
body.dark-mode .ms-res-ctn {
  background: var(--cm-surface);
  border-color: var(--cm-border-strong);
}
body.dark-mode .ms-res-ctn .ms-res-item {
  color: var(--cm-text);
}
body.dark-mode .ms-res-ctn .ms-res-item:hover,
body.dark-mode .ms-res-ctn .ms-res-item:focus,
body.dark-mode .ms-res-ctn .ms-res-item.active {
  background: #36557a;
  color: #fff;
}
body.dark-mode .ms-res-ctn .ms-res-item em { color: #9fc3ea; }
body.dark-mode .ms-ctn .ms-trigger { border-left-color: #454d58; }

/* ============================ Text / misc ============================ */
body.dark-mode .lesson-description,
body.dark-mode .editor { color: var(--cm-muted-2); }
body.dark-mode .c_area_commentary { color: var(--cm-text); }

/* ============================ Pikaday (date picker) ============================ */
body.dark-mode .pika-single {
  background: var(--cm-surface);
  border-color: var(--cm-border);
  color: var(--cm-text);
}
body.dark-mode .pika-lendar,
body.dark-mode .pika-title { background: var(--cm-surface); }
body.dark-mode .pika-table th,
body.dark-mode .pika-label { color: var(--cm-muted); }
body.dark-mode .pika-button {
  background: transparent;
  color: var(--cm-text);
}
body.dark-mode .pika-day:hover .pika-button,
body.dark-mode .pika-day.pika-prev:hover .pika-button,
body.dark-mode .pika-day.pika-next:hover .pika-button {
  background: #36557a;
  color: #fff;
}
body.dark-mode .pika-day.pika-selected .pika-button {
  background: var(--cm-primary);
  color: #fff;
}
body.dark-mode .pika-day.is-today .pika-button { color: #8ab4f8; }
body.dark-mode .pika-day.pika-disabled .pika-button,
body.dark-mode .pika-day.pika-disabled.is-today .pika-button { color: var(--cm-muted); opacity: 0.5; }

/* ============================ Kalan koyu metin onlemleri (dark) ============================ */
/* MagicSuggest sonuc grubu basligi (kaynak #333) koyu panelde acilmali */
body.dark-mode .ms-res-ctn .ms-res-group { color: var(--cm-muted); }
/* H2H skorlari: koyu zemin uzerine acik yesil/kirmizi */
body.dark-mode .h2h-score-you { color: #6fd18f; }
body.dark-mode .h2h-score-them { color: #ff8f7a; }
/* game_result rematch onay notu (yesil) koyu zemin uzerine okunur */
body.dark-mode #game_result #rematch_status .game-result-note {
  color: #6fd18f;
  border-color: rgba(111, 209, 143, 0.35);
  background-color: rgba(30, 125, 79, 0.18);
}
/* Istatistik tablosu sayac etiketleri */
body.dark-mode .chartlist .count { color: var(--cm-text); }

/* ============================ Chartist grafikleri (stats_user #userchart vb.) ============================ */
/* Eksen etiketleri varsayilan rgba(0,0,0,.4) koyu zeminde siyah gorunuyordu */
body.dark-mode .ct-label {
  fill: rgba(223, 227, 232, 0.75);
  color: rgba(223, 227, 232, 0.75);
}
body.dark-mode .ct-grid,
body.dark-mode .ct-grid-background {
  stroke: rgba(255, 255, 255, 0.12);
}
body.dark-mode .ct-horizontal,
body.dark-mode .ct-vertical {
  stroke: rgba(255, 255, 255, 0.05);
}
/* Lejant metni + swatch'lar koyu zeminde okunur */
body.dark-mode .ct-legend { color: var(--cm-text); }
body.dark-mode .ct-series-0 { color: #ff8f8a; }
body.dark-mode .ct-series-0:before { background-color: #ff6b66; }
body.dark-mode .ct-series-1 { color: #9db3f0; }
body.dark-mode .ct-series-1:before { background-color: #7f9be8; }