/* Dorj el Kunuz — vault components. Themes can override the variables. */
:root {
	--dorj-ink: #0b0a08;
	--dorj-panel: #16130e;
	--dorj-panel-2: #1d1913;
	--dorj-line: rgba(227, 184, 102, .16);
	--dorj-line-strong: rgba(227, 184, 102, .38);
	--dorj-gold: #e3b866;
	--dorj-gold-hi: #f7deA0;
	--dorj-gold-lo: #9c7432;
	--dorj-text: #f1e9d8;
	--dorj-mute: #a59b87;
	--dorj-danger: #e8836b;
	--dorj-ok: #9fd3a4;
	--dorj-radius: 14px;
	--dorj-font-display: inherit;
	--dorj-font-num: inherit;
}

.dorj-vault, .dorj-panel, .dorj-auth, .dorj-keyring, .dorj-hall, .dorj-tonight, .dorj-card { color: var(--dorj-text); }

/* ---------------------------------------------------------------- buttons */
.dorj-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .5em;
	padding: .85em 1.6em; border-radius: 999px; border: 1px solid transparent;
	font: inherit; font-weight: 700; line-height: 1.1; text-decoration: none; cursor: pointer;
	transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.dorj-btn--gold {
	color: #1a1206; background: linear-gradient(180deg, var(--dorj-gold-hi), var(--dorj-gold) 55%, var(--dorj-gold-lo));
	box-shadow: 0 0 0 1px rgba(255,255,255,.15) inset, 0 8px 30px -10px rgba(227,184,102,.6);
}
.dorj-btn--gold:hover { transform: translateY(-1px); box-shadow: 0 0 0 1px rgba(255,255,255,.25) inset, 0 12px 40px -10px rgba(227,184,102,.8); color: #1a1206; }
.dorj-btn--ghost { color: var(--dorj-gold); border-color: var(--dorj-line-strong); background: transparent; }
.dorj-btn--ghost:hover { background: rgba(227,184,102,.08); color: var(--dorj-gold-hi); }
.dorj-btn--block { width: 100%; }
.dorj-btn:disabled { opacity: .6; cursor: progress; }
.dorj-btn:focus-visible, .dorj-drawer:focus-visible { outline: 2px solid var(--dorj-gold-hi); outline-offset: 3px; }

/* ------------------------------------------------------------------ vault */
.dorj-vault {
	--rx: 0deg; --ry: 0deg; --mx: 50%; --my: 30%;
	perspective: 1600px; position: relative; max-width: 980px; margin-inline: auto;
}
.dorj-cabinet {
	position: relative; display: grid; grid-template-columns: repeat(6, 1fr); gap: clamp(6px, 1.2vw, 12px);
	padding: clamp(12px, 2.4vw, 26px); border-radius: 18px;
	background:
		radial-gradient(120% 80% at var(--mx) var(--my), rgba(227,184,102,.09), transparent 60%),
		linear-gradient(160deg, #1b1712, #0d0b08 60%, #14110c);
	box-shadow:
		0 0 0 1px var(--dorj-line) inset,
		0 1px 0 rgba(255,255,255,.05) inset,
		0 60px 120px -40px rgba(0,0,0,.9),
		0 0 120px -30px rgba(227,184,102,.18);
	transform: rotateX(var(--rx)) rotateY(var(--ry));
	transform-style: preserve-3d; transition: transform .35s cubic-bezier(.2,.7,.2,1);
}
.dorj-cabinet::before { /* top crown */
	content: ""; position: absolute; inset-inline: 6%; top: -10px; height: 10px; border-radius: 10px 10px 0 0;
	background: linear-gradient(90deg, transparent, var(--dorj-gold-lo), var(--dorj-gold), var(--dorj-gold-lo), transparent); opacity: .55;
}
.dorj-drawer {
	position: relative; display: block; aspect-ratio: 1.18 / 1; text-decoration: none; color: inherit;
	transform-style: preserve-3d; cursor: pointer; border-radius: 8px;
}
.dorj-drawer__face {
	position: absolute; inset: 0; display: grid; grid-template-rows: 1fr auto auto; justify-items: center; align-items: center;
	padding: 10% 6% 24%; border-radius: 8px; overflow: hidden;
	background: linear-gradient(165deg, #25201a 0%, #15120e 55%, #0f0d0a 100%);
	box-shadow:
		0 0 0 1px rgba(227,184,102,.14) inset,
		0 1px 0 rgba(255,255,255,.06) inset,
		0 -6px 14px rgba(0,0,0,.45) inset,
		0 6px 14px -6px rgba(0,0,0,.8);
	transition: transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease, background .4s ease;
}
.dorj-drawer__num {
	font-family: var(--dorj-font-num); font-size: clamp(15px, 2.6vw, 30px); line-height: 1; letter-spacing: .02em;
	background: linear-gradient(180deg, var(--dorj-gold-hi), var(--dorj-gold) 50%, var(--dorj-gold-lo));
	-webkit-background-clip: text; background-clip: text; color: transparent; opacity: .45;
}
.dorj-drawer__handle {
	width: 34%; height: 4px; border-radius: 4px; margin-block: 6% 0;
	background: linear-gradient(90deg, var(--dorj-gold-lo), var(--dorj-gold-hi), var(--dorj-gold-lo));
	box-shadow: 0 2px 4px rgba(0,0,0,.6); opacity: .55;
}
.dorj-drawer__status { position: absolute; inset-inline: 0; bottom: 7%; text-align: center; font-size: clamp(8px, .85vw, 11px); line-height: 1.2; color: var(--dorj-mute); white-space: nowrap; }
.dorj-drawer__glow { position: absolute; inset: -2px; border-radius: 10px; pointer-events: none; opacity: 0; transition: opacity .4s; }

.dorj-drawer.is-open .dorj-drawer__face {
	transform: translateZ(22px);
	background: linear-gradient(165deg, #3a2e1a, #1c160d 60%, #120e08);
	box-shadow: 0 0 0 1px var(--dorj-gold) inset, 0 0 24px rgba(227,184,102,.45), 0 20px 30px -10px rgba(0,0,0,.9);
}
.dorj-drawer.is-open .dorj-drawer__num, .dorj-drawer.is-open .dorj-drawer__handle { opacity: 1; }
.dorj-drawer.is-open .dorj-drawer__status { color: var(--dorj-gold-hi); font-weight: 700; }
.dorj-drawer.is-open .dorj-drawer__glow { opacity: 1; animation: dorj-pulse 2.2s ease-in-out infinite; box-shadow: 0 0 40px 6px rgba(227,184,102,.35); }

.dorj-drawer.is-closed .dorj-drawer__face { transform: translateZ(8px); }
.dorj-drawer.is-closed .dorj-drawer__num { opacity: .8; }
.dorj-drawer.is-closed .dorj-drawer__handle { opacity: .8; }
.dorj-drawer.is-mine .dorj-drawer__status { color: var(--dorj-gold-hi); font-size: clamp(12px, 1.5vw, 16px); }
.dorj-drawer:not(.is-locked):hover .dorj-drawer__face { transform: translateZ(30px); }
.dorj-drawer.is-locked { cursor: not-allowed; }
.dorj-drawer__face { grid-template-rows: 1fr auto; }
.dorj-drawer.is-locked:not(.dorj-drawer--grand) .dorj-drawer__face { padding-bottom: 12%; }
.dorj-drawer.is-locked .dorj-drawer__status { display: none; }
.dorj-drawer.is-closed .dorj-drawer__face::before { /* pulled-out drawer: dark gap above the front */
	content: ""; position: absolute; inset-inline: 6px; top: 0; height: 5px; border-radius: 0 0 4px 4px;
	background: linear-gradient(180deg, #000, rgba(0,0,0,0)); box-shadow: 0 1px 0 rgba(227,184,102,.25);
}
.dorj-drawer.is-closed .dorj-drawer__status { color: var(--dorj-gold); opacity: .8; }
.dorj-drawer.is-locked:hover .dorj-drawer__num { opacity: .65; }
.dorj-drawer.is-shake .dorj-drawer__face { animation: dorj-shake .45s; }
.dorj-drawer.is-just-changed .dorj-drawer__face { animation: dorj-pop .9s cubic-bezier(.2,.8,.2,1); }

.dorj-drawer--grand { margin-top: clamp(10px, 2vw, 18px); aspect-ratio: auto; height: clamp(70px, 10vw, 104px); }
.dorj-drawer--grand .dorj-drawer__face {
	grid-template-rows: none; grid-template-columns: auto 1fr auto; gap: 16px; padding: 0 clamp(16px, 3vw, 32px); justify-items: start;
	background: linear-gradient(90deg, #2a2116, #16120c 40%, #16120c 60%, #2a2116);
	box-shadow: 0 0 0 1px var(--dorj-line-strong) inset, 0 10px 30px -10px rgba(0,0,0,.9);
}
.dorj-drawer--grand .dorj-drawer__num { font-size: clamp(26px, 4vw, 44px); opacity: .9; }
.dorj-drawer--grand .dorj-drawer__label { font-family: var(--dorj-font-display); font-size: clamp(14px, 2vw, 22px); color: var(--dorj-gold-hi); }
.dorj-drawer--grand .dorj-drawer__handle { width: 70px; margin: 0; opacity: .9; }

@keyframes dorj-pulse { 0%,100% { opacity: .55 } 50% { opacity: 1 } }
@keyframes dorj-shake { 0%,100% { transform: translateX(0) } 20% { transform: translateX(-5px) } 40% { transform: translateX(5px) } 60% { transform: translateX(-3px) } 80% { transform: translateX(3px) } }
@keyframes dorj-pop { 0% { transform: translateZ(0) } 40% { transform: translateZ(60px) } 100% { transform: translateZ(22px) } }

@media (max-width: 640px) {
	.dorj-cabinet { grid-template-columns: repeat(5, 1fr); }
	.dorj-drawer__status { display: none; }
	.dorj-drawer.is-mine .dorj-drawer__status { display: block; }
}
@media (prefers-reduced-motion: reduce) {
	.dorj-cabinet, .dorj-drawer__face { transition: none; }
	.dorj-drawer.is-open .dorj-drawer__glow { animation: none; }
}

/* -------------------------------------------------------------- countdown */
.dorj-countdown { text-align: center; }
.dorj-countdown__label { color: var(--dorj-mute); font-size: .95rem; margin-bottom: .6rem; }
.dorj-countdown__units { display: inline-flex; gap: clamp(8px, 2vw, 18px); }
.dorj-countdown__unit[hidden] { display: none; }
.dorj-countdown__unit { display: grid; min-width: 4.2ch; padding: .55em .7em .45em; border-radius: 12px; background: var(--dorj-panel); box-shadow: 0 0 0 1px var(--dorj-line) inset; }
.dorj-countdown__n { font-family: var(--dorj-font-num); font-size: clamp(1.6rem, 5vw, 2.8rem); line-height: 1; color: var(--dorj-gold-hi); font-variant-numeric: tabular-nums; }
.dorj-countdown__l { font-size: .72rem; color: var(--dorj-mute); margin-top: .35em; }
.dorj-countdown--sm .dorj-countdown__n { font-size: clamp(1.2rem, 3.4vw, 1.8rem); }
.dorj-countdown--sm { margin: 1.2rem 0; }

/* ---------------------------------------------------------------- tonight */
.dorj-tonight { position: relative; text-align: center; padding: clamp(20px, 4vw, 40px); border-radius: 22px; background: radial-gradient(100% 70% at 50% 0%, rgba(227,184,102,.14), transparent 70%), var(--dorj-panel); box-shadow: 0 0 0 1px var(--dorj-line) inset; }
.dorj-tonight__eyebrow { color: var(--dorj-gold); font-weight: 700; letter-spacing: .06em; font-size: .85rem; }
.dorj-tonight__num { font-family: var(--dorj-font-num); font-size: clamp(64px, 12vw, 120px); line-height: 1; margin: .1em 0; background: linear-gradient(180deg, var(--dorj-gold-hi), var(--dorj-gold-lo)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.dorj-tonight__title { font-family: var(--dorj-font-display); margin: 0 0 .4em; color: var(--dorj-text); }
.dorj-tonight__teaser { color: var(--dorj-mute); margin: 0 auto 1rem; max-width: 40ch; }
.dorj-tonight .dorj-countdown { margin: 1.2rem 0 1.4rem; }

/* ------------------------------------------------------------ drawer page */
.dorj-panel { display: grid; gap: 1.4rem; }
.dorj-video, .dorj-embed iframe { width: 100%; border-radius: var(--dorj-radius); background: #000; display: block; }
.dorj-embed { border-radius: var(--dorj-radius); overflow: hidden; }
.dorj-embed iframe { aspect-ratio: 9 / 16; max-height: 80vh; height: auto; }
.dorj-locked { text-align: center; padding: clamp(28px, 6vw, 60px) 16px; border-radius: 22px; background: var(--dorj-panel); box-shadow: 0 0 0 1px var(--dorj-line) inset; }
.dorj-locked__text { font-size: 1.15rem; margin: 1rem 0 0; }
.dorj-locked__when { color: var(--dorj-mute); }
.dorj-lock-icon { width: 64px; height: 76px; margin: 0 auto; position: relative; }
.dorj-lock-icon::before { content: ""; position: absolute; inset-inline: 12px; top: 0; height: 40px; border: 6px solid var(--dorj-gold); border-bottom: 0; border-radius: 26px 26px 0 0; }
.dorj-lock-icon::after { content: ""; position: absolute; inset-inline: 0; bottom: 0; height: 44px; border-radius: 10px; background: linear-gradient(180deg, var(--dorj-gold-hi), var(--dorj-gold-lo)); box-shadow: 0 10px 30px -8px rgba(227,184,102,.6); }

.dorj-prize { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: 0; border-radius: 22px; overflow: hidden; background: var(--dorj-panel); box-shadow: 0 0 0 1px var(--dorj-line) inset; }
.dorj-prize__media { position: relative; min-height: 220px; background: radial-gradient(80% 80% at 50% 40%, #2a2116, #0e0c09); }
.dorj-prize__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: filter .9s ease, transform .9s ease; }
.dorj-prize__media img.is-blurred { filter: blur(22px) saturate(.6) brightness(.7); transform: scale(1.15); }
.dorj-prize__placeholder { position: absolute; inset: 0; background: radial-gradient(30% 30% at 50% 50%, rgba(227,184,102,.55), transparent 70%), repeating-conic-gradient(from 0deg, rgba(227,184,102,.06) 0 10deg, transparent 10deg 20deg); filter: blur(6px); }
.dorj-prize.is-hidden .dorj-prize__media::after { content: "؟"; position: absolute; inset: 0; display: grid; place-items: center; font-size: 90px; color: var(--dorj-gold-hi); font-family: var(--dorj-font-display); text-shadow: 0 0 30px rgba(227,184,102,.7); }
.dorj-prize__body { padding: clamp(18px, 3vw, 32px); display: grid; align-content: center; gap: .6rem; }
.dorj-prize__title { font-family: var(--dorj-font-display); font-size: clamp(1.3rem, 3vw, 2rem); margin: 0; color: var(--dorj-text); line-height: 1.3; }
.dorj-prize__desc { color: var(--dorj-mute); }
.dorj-prize__desc p { margin: 0 0 .6em; }
.dorj-prize-slot.is-opening .dorj-prize { animation: dorj-reveal .9s cubic-bezier(.2,.8,.2,1); }
@keyframes dorj-reveal { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
@media (max-width: 720px) { .dorj-prize { grid-template-columns: 1fr; } }

.dorj-badge { justify-self: start; display: inline-block; padding: .3em .8em; border-radius: 999px; font-size: .75rem; font-weight: 700; color: var(--dorj-gold); background: rgba(227,184,102,.1); box-shadow: 0 0 0 1px var(--dorj-line-strong) inset; }
.dorj-badge--golden { color: #1a1206; background: linear-gradient(180deg, var(--dorj-gold-hi), var(--dorj-gold)); }
.dorj-badge--agency { color: #cfe3ff; background: rgba(120,160,255,.12); box-shadow: 0 0 0 1px rgba(120,160,255,.35) inset; }
.dorj-badge--creative { color: #f5c6e0; background: rgba(240,140,200,.1); box-shadow: 0 0 0 1px rgba(240,140,200,.35) inset; }

.dorj-riddle { padding: clamp(18px, 3vw, 30px); border-radius: 22px; background: linear-gradient(180deg, rgba(227,184,102,.08), transparent), var(--dorj-panel-2); box-shadow: 0 0 0 1px var(--dorj-line-strong) inset; }
.dorj-riddle__eyebrow { display: block; color: var(--dorj-gold); font-weight: 700; font-size: .85rem; margin-bottom: .4rem; }
.dorj-riddle__q { font-family: var(--dorj-font-display); font-size: clamp(1.1rem, 2.6vw, 1.5rem); line-height: 1.7; }
.dorj-riddle__q p { margin: 0 0 .5em; }
.dorj-riddle__hint { color: var(--dorj-mute); margin: .4rem 0 1rem; }
.dorj-riddle__hint summary { cursor: pointer; color: var(--dorj-gold); }
.dorj-riddle__row { display: flex; gap: .6rem; margin-top: 1rem; }
.dorj-riddle__row input { flex: 1; min-width: 0; }
.dorj-riddle__msg { min-height: 1.4em; margin: .8rem 0 0; color: var(--dorj-mute); }
.dorj-riddle__msg.is-error { color: var(--dorj-danger); }
.dorj-riddle__keys { color: var(--dorj-gold-hi); font-weight: 700; }
.dorj-riddle.is-shake { animation: dorj-shake .45s; }

.dorj-entered, .dorj-gate, .dorj-welcome { padding: 1.1rem 1.3rem; border-radius: 16px; background: rgba(227,184,102,.08); box-shadow: 0 0 0 1px var(--dorj-line-strong) inset; color: var(--dorj-gold-hi); text-align: center; }
.dorj-gate p { color: var(--dorj-text); margin: 0 0 .9rem; }
.dorj-winner { display: grid; justify-items: center; gap: .3rem; padding: 1.6rem; border-radius: 22px; background: radial-gradient(80% 100% at 50% 0%, rgba(227,184,102,.18), transparent 70%), var(--dorj-panel); box-shadow: 0 0 0 1px var(--dorj-line-strong) inset; }
.dorj-winner__eyebrow { color: var(--dorj-mute); }
.dorj-winner__name { font-family: var(--dorj-font-display); font-size: clamp(1.6rem, 4vw, 2.4rem); color: var(--dorj-gold-hi); }
.dorj-winner__handle { color: var(--dorj-gold); direction: ltr; }
.dorj-share { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; color: var(--dorj-mute); font-size: .9rem; }
.dorj-share a, .dorj-share button { color: var(--dorj-gold); background: none; border: 0; padding: 0; font: inherit; cursor: pointer; text-decoration: none; }

/* burst */
.dorj-prize-slot { position: relative; }
.dorj-burst { position: absolute; inset: 0; pointer-events: none; display: grid; place-items: center; }
.dorj-burst i { position: absolute; width: 6px; height: 6px; border-radius: 2px; background: var(--dorj-gold-hi); box-shadow: 0 0 8px var(--dorj-gold); animation: dorj-fly 1.4s cubic-bezier(.1,.7,.3,1) var(--d) forwards; }
@keyframes dorj-fly { from { transform: translate(0,0) rotate(0); opacity: 1; } to { transform: translate(var(--x), var(--y)) rotate(320deg); opacity: 0; } }

/* ------------------------------------------------------------------ forms */
.dorj-auth { max-width: 560px; margin-inline: auto; padding: clamp(18px, 4vw, 34px); border-radius: 24px; background: var(--dorj-panel); box-shadow: 0 0 0 1px var(--dorj-line) inset, 0 40px 80px -40px rgba(0,0,0,.8); }
.dorj-auth__tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; border-radius: 999px; background: #0c0a07; box-shadow: 0 0 0 1px var(--dorj-line) inset; margin-bottom: 1.4rem; }
.dorj-auth__tabs button { padding: .7em; border: 0; border-radius: 999px; background: transparent; color: var(--dorj-mute); font: inherit; font-weight: 700; cursor: pointer; }
.dorj-auth__tabs button[aria-selected="true"] { color: #1a1206; background: linear-gradient(180deg, var(--dorj-gold-hi), var(--dorj-gold)); }
.dorj-form { display: grid; gap: .95rem; }
.dorj-form[hidden] { display: none; }
.dorj-form label { display: grid; gap: .35rem; }
.dorj-form label > span { font-size: .85rem; color: var(--dorj-mute); }
.dorj-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: .95rem; }
@media (max-width: 520px) { .dorj-form__row { grid-template-columns: 1fr; } }
.dorj-form input[type=text], .dorj-form input[type=tel], .dorj-form input[type=email], .dorj-form input[type=password], .dorj-form select, .dorj-riddle input {
	width: 100%; padding: .85em 1em; border-radius: 12px; border: 1px solid var(--dorj-line); background: #0c0a07; color: var(--dorj-text); font: inherit; outline: none; transition: border-color .2s, box-shadow .2s;
}
.dorj-form input:focus, .dorj-form select:focus, .dorj-riddle input:focus { border-color: var(--dorj-gold); box-shadow: 0 0 0 3px rgba(227,184,102,.18); }
.dorj-check { display: flex !important; grid-template-columns: none; align-items: flex-start; gap: .6rem !important; font-size: .9rem; }
.dorj-check input { margin-top: .25em; accent-color: var(--dorj-gold); width: 18px; height: 18px; flex: none; }
.dorj-check span { color: var(--dorj-text) !important; font-size: .9rem !important; }
.dorj-check a { color: var(--dorj-gold); }
.dorj-form__aside { text-align: center; margin: 0; font-size: .9rem; }
.dorj-form__aside a { color: var(--dorj-gold); }
.dorj-hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; opacity: 0; pointer-events: none; }
.dorj-alert { padding: .9rem 1.1rem; border-radius: 12px; margin-bottom: 1rem; background: rgba(232,131,107,.1); box-shadow: 0 0 0 1px rgba(232,131,107,.4) inset; color: #ffd2c6; }
.dorj-alert ul { margin: 0; padding-inline-start: 1.1rem; }
.dorj-card { padding: clamp(20px, 4vw, 36px); border-radius: 22px; background: var(--dorj-panel); box-shadow: 0 0 0 1px var(--dorj-line) inset; }
.dorj-card--center { text-align: center; }
.dorj-key-icon { width: 60px; height: 60px; margin: 0 auto 10px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, var(--dorj-gold-hi), var(--dorj-gold-lo)); box-shadow: 0 0 40px rgba(227,184,102,.5); }
.dorj-note { padding: 1rem; border: 1px dashed var(--dorj-line-strong); border-radius: 12px; color: var(--dorj-mute); text-align: center; }

/* ---------------------------------------------------------------- keyring */
.dorj-keyring { display: grid; gap: 1.6rem; }
.dorj-keyring__head { display: flex; align-items: center; gap: clamp(16px, 4vw, 32px); padding: clamp(18px, 4vw, 32px); border-radius: 24px; background: var(--dorj-panel); box-shadow: 0 0 0 1px var(--dorj-line) inset; }
.dorj-keyring__name { font-family: var(--dorj-font-display); margin: 0 0 .3rem; color: var(--dorj-text); }
.dorj-keyring__meta { margin: 0; color: var(--dorj-mute); }
.dorj-ring { --p: 0; flex: none; width: clamp(110px, 22vw, 150px); aspect-ratio: 1; border-radius: 50%; display: grid; place-content: center; text-align: center; position: relative;
	background: conic-gradient(var(--dorj-gold) calc(var(--p) * 1%), rgba(227,184,102,.12) 0); }
.dorj-ring::before { content: ""; position: absolute; inset: 9px; border-radius: 50%; background: var(--dorj-panel); }
.dorj-ring__n, .dorj-ring__of { position: relative; }
.dorj-ring__n { font-family: var(--dorj-font-num); font-size: clamp(2rem, 6vw, 3rem); line-height: 1; color: var(--dorj-gold-hi); }
.dorj-ring__of { color: var(--dorj-mute); font-size: .85rem; }
.dorj-slots { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(10, 1fr); gap: 8px; }
@media (max-width: 640px) { .dorj-slots { grid-template-columns: repeat(6, 1fr); } }
.dorj-slot a { display: grid; place-items: center; aspect-ratio: 1; border-radius: 10px; text-decoration: none; color: var(--dorj-mute); background: var(--dorj-panel); box-shadow: 0 0 0 1px var(--dorj-line) inset; font-family: var(--dorj-font-num); }
.dorj-slot.is-got a { color: #1a1206; background: linear-gradient(180deg, var(--dorj-gold-hi), var(--dorj-gold)); box-shadow: 0 6px 18px -6px rgba(227,184,102,.6); }
.dorj-slot.is-open a { color: var(--dorj-gold-hi); box-shadow: 0 0 0 2px var(--dorj-gold) inset; animation: dorj-pulse 2s infinite; }
.dorj-slot.is-missed a { opacity: .35; text-decoration: line-through; }
.dorj-legend { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; font-size: .85rem; color: var(--dorj-mute); }
.dorj-legend span::before { content: ""; display: inline-block; width: 12px; height: 12px; border-radius: 4px; margin-inline-end: .4rem; vertical-align: -1px; background: var(--dorj-panel); box-shadow: 0 0 0 1px var(--dorj-line) inset; }
.dorj-legend .is-got::before { background: var(--dorj-gold); }
.dorj-legend .is-open::before { box-shadow: 0 0 0 2px var(--dorj-gold) inset; }
.dorj-legend .is-missed::before { opacity: .35; }
.dorj-keyring__logout { text-align: center; margin: 0; }
.dorj-keyring__logout a { color: var(--dorj-mute); }

/* ------------------------------------------------------------------- hall */
.dorj-hall { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.dorj-hall__item { position: relative; display: grid; gap: .45rem; align-content: start; padding: 14px; border-radius: 18px; text-decoration: none; color: var(--dorj-text); background: var(--dorj-panel); box-shadow: 0 0 0 1px var(--dorj-line) inset; transition: transform .25s, box-shadow .25s; }
.dorj-hall__item:hover { transform: translateY(-3px); box-shadow: 0 0 0 1px var(--dorj-line-strong) inset, 0 20px 40px -20px rgba(0,0,0,.9); }
.dorj-hall__item img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 12px; }
.dorj-hall__num { position: absolute; inset-inline-end: 22px; top: 20px; font-family: var(--dorj-font-num); font-size: 1.4rem; color: var(--dorj-gold-hi); text-shadow: 0 2px 10px rgba(0,0,0,.8); }
.dorj-hall__prize { font-family: var(--dorj-font-display); font-size: 1.05rem; }
.dorj-hall__winner { color: var(--dorj-gold); font-size: .9rem; }
.dorj-hall__item--golden { box-shadow: 0 0 0 1px var(--dorj-gold) inset; }
.dorj-stat { font-family: var(--dorj-font-num); color: var(--dorj-gold-hi); }

/* ------------------------------------------------------- language switch */
.dorj-lang {
	display: inline-grid; place-items: center; min-width: 44px; height: 38px; padding: 0 .8em; border-radius: 999px;
	color: var(--dorj-gold); text-decoration: none; font-weight: 600; font-size: 14px; letter-spacing: .04em;
	box-shadow: 0 0 0 1px var(--dorj-line-strong) inset; transition: background .2s, color .2s;
}
.dorj-lang:hover { background: rgba(227,184,102,.1); color: var(--dorj-gold-hi); }
.dorj-lang[lang="ar"] { font-family: var(--dorj-font-display); letter-spacing: 0; font-size: 15px; }

.dorj-note { margin-top: 18px; }
.dorj-note p { margin: 0 0 .6rem; }
.dorj-note p:last-child { margin: 0; }
.dorj-note__small { font-size: .8rem; opacity: .75; }