/* canavar.win shared look: the home page's header and gold-on-black theme, used by every page.
   Page bodies opt in with <body class="cv">; the Damage Lab and Arena only take the header. */
:root{--cv-bg:#0a0907;--cv-panel:#15110b;--cv-panel-2:#0f0c08;--cv-line:#c9a35a2e;--cv-line-2:#c9a35a5c;--cv-gold:#d9b46a;--cv-gold-hi:#f2cf7f;--cv-text:#efe6d2;--cv-muted:#b9ae97;--cv-dim:#8f8676;--cv-serif:Cinzel,Georgia,serif;--cv-display:"Cormorant Garamond",Georgia,serif}

/* header */
.site-header{position:relative;z-index:10;flex-shrink:0;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;max-width:none;height:84px;margin:0;padding:0 clamp(20px,4vw,64px);background:linear-gradient(180deg,#0d0b08,#0a0907);border-bottom:1px solid #c9a35a40;box-shadow:0 1px 0 #00000080;font-family:Arial,sans-serif;line-height:normal}
.site-header *{box-sizing:border-box;font-family:inherit}
.site-header:after{content:"";position:absolute;left:50%;bottom:-5px;width:9px;height:9px;transform:translateX(-50%) rotate(45deg);background:#d9b46a;box-shadow:0 0 10px #f2c86e}
.site-header a{margin:0;text-decoration:none;border:0;border-radius:0;background:none;padding:0;color:inherit}
.site-header a:focus-visible{outline:2px solid #e1bd75;outline-offset:4px}
.site-brand{display:flex!important;align-items:center;gap:12px;white-space:nowrap;font-family:var(--cv-serif)!important;font-size:26px;font-weight:700;letter-spacing:3px;color:#efe3c7;text-shadow:0 2px 10px #000}
.brand-emblem{width:42px;height:42px;border-radius:50%;filter:drop-shadow(0 0 6px #d9b46a66)}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-text b{font-weight:700}.brand-text b i{font-style:normal;color:#e2b85e}
.brand-text small{font-family:var(--cv-serif);font-size:9.5px;letter-spacing:4px;color:#c9b48a;margin-top:6px;text-align:center}
.site-nav{display:flex;gap:4px;align-items:center}
.site-nav a{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;font-size:15px;font-weight:600;color:#ddd3bf;border:1px solid transparent;border-radius:8px;white-space:nowrap}
.site-nav a:hover{background:#ffffff0a;color:#fff}
.site-nav a svg.nav-ico{width:19px;height:19px;color:#cfc3a8}
.site-nav a[aria-current="page"]{color:#f6e2b0;border-color:#d9b46a;background:linear-gradient(180deg,#2c2312,#16110a);box-shadow:inset 0 0 12px #d9b46a2e,0 0 12px #d9b46a26}
.site-nav a[aria-current="page"] svg.nav-ico{color:#f6e2b0}
.site-nav .discord-menu{margin-left:6px;background:none;border:0;color:#7984ff;padding:10px}
.site-nav .discord-menu:hover{background:#ffffff0a;color:#9aa2ff}
.site-nav .discord-menu:focus-visible{outline-color:#afb4ff}
.discord-menu svg{width:30px;height:30px}
@media(max-width:1120px){.site-nav a{padding:10px;font-size:14px}.site-nav a svg.nav-ico{display:none}}
@media(max-width:900px){.site-header{padding:0 20px;gap:12px}.site-brand{font-size:21px}.brand-emblem{width:36px;height:36px}.brand-text small{font-size:8px;letter-spacing:3px}.site-nav a{padding:8px;font-size:13px}}
@media(max-width:760px){.site-header{height:auto;min-height:0;padding:14px 16px;flex-direction:column;align-items:flex-start;gap:15px;background:#0b0a08}.site-header:after{display:none}.site-brand{font-size:21px}.brand-emblem{width:34px;height:34px}.site-nav{width:100%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}.site-nav a{padding:6px 2px;font-size:11.5px;min-height:42px;background:#ffffff06;white-space:normal;text-align:center;line-height:1.2}.site-nav .discord-menu{margin-left:0;padding:6px 2px}.discord-menu svg{width:22px;height:22px}}

/* page body */
body.cv{margin:0;min-height:100vh;color:var(--cv-text);font:15px/1.6 Arial,sans-serif;background:radial-gradient(ellipse 70% 420px at 50% 0,#3a2b1440,#0000 70%),var(--cv-bg)}
body.cv *{box-sizing:border-box}
.cv h1,.cv-title{font-family:var(--cv-display);font-weight:700;letter-spacing:.3px;color:#f1e3c3;background:linear-gradient(180deg,#fff4da 10%,#e8cf98 55%,#b88f4d);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 4px #000c)}
.cv h2,.cv h3{font-family:var(--cv-serif);letter-spacing:.5px;color:#ead6a6}
.cv-eyebrow{display:inline-flex;align-items:center;gap:12px;font-family:var(--cv-serif);font-size:12px;font-weight:600;letter-spacing:5px;color:#e3cf9f}
.cv-eyebrow:before{content:"";width:34px;height:1px;background:linear-gradient(90deg,#d9b46a00,#d9b46a)}
.cv-rule{display:block;width:min(260px,60%);height:12px;margin:14px 0 0;background:radial-gradient(circle,#f2cf7f 0 3px,#0000 4px) center/12px 12px no-repeat,linear-gradient(90deg,#d9b46a00,#d9b46a 50%,#d9b46a00) center/100% 1px no-repeat}
.cv-panel{border:1px solid var(--cv-line);border-radius:10px;background:linear-gradient(180deg,#17130d,#100d09);box-shadow:0 14px 40px #0006}
.cv-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 30px;border:0;font:800 15px Arial,sans-serif;color:#2b1a05;background:linear-gradient(180deg,#ffe9a3,#e7b94e 55%,#b9852b);clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,14px 100%,0 50%);text-shadow:0 1px 0 #fff6;text-decoration:none;cursor:pointer}
.cv-btn:hover{filter:brightness(1.08)}
.cv-btn:focus-visible{outline:none;filter:drop-shadow(0 0 3px #fff) drop-shadow(0 0 10px #e8b85c)}
.ko-breadcrumb,.ko-crumb{color:var(--cv-dim);font:12px Arial,sans-serif;letter-spacing:.3px;margin:22px 0}
.ko-breadcrumb a,.ko-crumb a{color:var(--cv-gold);text-decoration:none}
.ko-breadcrumb a:hover,.ko-crumb a:hover{text-decoration:underline}
.ko-breadcrumb span,.ko-crumb span{margin:0 10px;color:#6b5a33}
/* password pages */
.login-main{min-height:calc(100dvh - 84px);display:grid;place-items:center;padding:32px 20px}
.login-card{width:min(400px,100%);padding:32px 30px;text-align:center}
.login-card h1{font-size:40px;line-height:1.1;margin:14px 0 6px}
.login-card .cv-rule{margin:0 auto 6px}
.login-card p{color:var(--cv-muted);font-size:14px;line-height:1.6;margin:8px 0 22px}
.login-card label{display:block;text-align:left;font-size:13px;color:var(--cv-muted);margin-bottom:8px}
.login-card input{width:100%;border:1px solid #5a4724;border-radius:8px;background:#0b0907;color:#fff;padding:14px;font:16px Arial,sans-serif}
.login-card input:focus{outline:2px solid var(--cv-gold);outline-offset:2px}
.login-card .cv-btn{width:100%;margin-top:18px}
.login-card .err{color:#ff9f8a;margin:0 0 15px}
.login-card .back{display:block;color:var(--cv-dim);font-size:12px;margin-top:22px}
@media(max-width:760px){.login-main{min-height:0;padding:40px 16px}}
.cv-footer{max-width:1120px;margin:40px auto 0;padding:22px 28px 30px;border-top:1px solid var(--cv-line);text-align:center;font:11px/1.6 var(--cv-serif);letter-spacing:3px;color:var(--cv-dim)}
@media(max-width:760px){.cv-footer{padding:20px 16px}}
