/* The GM panel (yedidiyar-gm.bereketyazilim.com.tr): the Yedi Diyar look of yd.css, and what only this panel
   has: the sign-in and set-up screens, the six boxes of a code, chat lines, the notes that say what is not here. */

body { margin: 0; background: #0e0f12; }
.yd [hidden] { display: none !important; }
.yd .said:empty { display: none; }
.yd .tr > .tag, .yd .tr > a > .tag { justify-self: start; }

/* Signing in and setting up: one card in the middle, the game's warm light above it. */
.yd .gm-auth { flex: 1 1 100%; min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 32px 16px;
  background: radial-gradient(ellipse at 50% 0%, #1b1912 0%, #0e0f12 62%); }
.yd .gm-box { width: 100%; max-width: 380px; display: flex; flex-direction: column; gap: 14px; }
.yd .gm-box.wide { max-width: 440px; }
.yd .gm-mark { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 6px; }
.yd .gm-mark .y-brand { width: 64px; height: 64px; border-radius: 13px; }
.yd .gm-mark .cz { font-size: 19px; font-weight: 700; color: var(--title); letter-spacing: .16em; }
.yd .gm-box .in { height: 38px; font-size: 14px; width: 100%; }
.yd .gm-box .y-btn { justify-content: center; height: 38px; font-size: 14px; }
.yd .gm-step { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background: #2a2416;
  border: 1px solid var(--bronze-2); color: var(--gold-2); font-size: 12px; font-weight: 800; flex: none; }
.yd .gm-steps { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12.5px; }
.yd .gm-steps .on { color: var(--gold-2); font-weight: 700; }
.yd .gm-steps .line { flex: 1; height: 1px; background: #2e2a22; }

/* Six boxes for a doğrulama code (one input each; typing goes on, pasting fills them all). */
.yd .gm-code { display: flex; gap: 8px; justify-content: center; }
.yd .gm-code input { width: 42px; height: 50px; border-radius: 7px; border: 1px solid var(--bronze); background: #0f1013; color: var(--ink);
  font-family: ui-monospace, 'Cascadia Mono', Consolas, monospace; font-size: 22px; text-align: center; padding: 0; }
.yd .gm-code input:focus { outline: none; border-color: #ddbb78; box-shadow: 0 0 0 3px rgba(201, 164, 92, .2); }
.yd .gm-qr { display: flex; justify-content: center; }
.yd .gm-qr svg { border-radius: 6px; display: block; }
.yd .gm-key { font-family: ui-monospace, 'Cascadia Mono', Consolas, monospace; font-size: 14px; color: var(--gold-2); letter-spacing: .08em; text-align: center; word-break: break-all; }
.yd .gm-codes { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; padding: 12px 14px; border: 1px dashed var(--bronze); border-radius: 8px; background: #0f1013;
  font-family: ui-monospace, 'Cascadia Mono', Consolas, monospace; font-size: 14px; color: var(--ink); }
.yd .meter { display: flex; gap: 4px; }
.yd .meter i { flex: 1; height: 4px; border-radius: 2px; background: #2e2a22; }
.yd .meter i.on { background: var(--good); }

/* Notes: a warning, a fact, what is locked away from this panel. */
.yd .note { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: 8px; font-size: 13px; line-height: 1.4; }
.yd .note.warn { background: #2a2210; border: 1px solid #5a4520; color: #f0d79a; }
.yd .note.info { background: #111a26; border: 1px solid #243a55; color: #b5d3f5; }
.yd .note.bad { background: #261412; border: 1px solid #5a2a24; color: #ffb4a8; }
.yd .lock { display: flex; gap: 8px; align-items: center; padding: 8px 12px; border-radius: 7px; background: #121316; border: 1px solid #24211c; color: var(--muted-2); font-size: 12.5px; }
.yd .lock svg { flex: none; }
.yd .sys { display: flex; gap: 8px; align-items: center; padding: 8px 12px; border: 1px dashed var(--bronze); border-radius: 8px; font-size: 12.5px; color: #d9bd86; }
.yd .roleb { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 5px; background: #142233; border: 1px solid #2a4a70; color: #a9cfff;
  font-size: 12px; font-weight: 800; letter-spacing: .04em; }
.yd .addr { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 4px; background: #1f2023; color: #a79f90; font-size: 11.5px; font-weight: 700; }

/* Chat lines (the log, a complaint's evidence): time, channel, who and what. */
.yd .chat { display: grid; grid-template-columns: 52px 64px minmax(0, 1fr); gap: 10px; align-items: baseline; padding: 6px 16px; font-size: 13.5px; border-bottom: 1px solid #1a1916; }
.yd .chat.hit { background: #2a1614; box-shadow: inset 2px 0 0 #e0675a; }
.yd .chat.mini { grid-template-columns: 46px minmax(0, 1fr); padding: 5px 12px; }
.yd .chat .k { font-size: 12.5px; font-weight: 700; }
.yd .ch-ulus { color: #ff8577; } .yd .ch-yakin { color: #d9d1c1; } .yd .ch-klan { color: #9ee07a; } .yd .ch-parti { color: #7fd8c9; }
.yd .ch-fisilti { color: #d79bff; } .yd .ch-genel { color: #d9d1c1; } .yd .ch-sistem { color: #d9bd86; }
.yd .proof { border: 1px solid #3a2e20; border-radius: 8px; overflow: hidden; }
.yd .proof .hd { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: #1a1810; border-bottom: 1px solid #3a2e20; flex-wrap: wrap; }

/* A shot picked from a ticket. */
.yd .seg { display: flex; flex-wrap: wrap; gap: 6px; }
.yd .y-chip.off { opacity: .45; cursor: not-allowed; text-decoration: line-through; }
.yd .gm-aside { flex: 1 1 420px; max-width: 540px; display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.yd .gm-mainc { flex: 999 1 560px; min-width: 0; display: flex; flex-direction: column; gap: 18px; }

@media print {
  .yd .y-side, .yd .y-top, .yd .y-btn, .yd .ck, .yd .gm-steps { display: none !important; }
  .yd .gm-codes { border-color: #000; color: #000; background: #fff; }
}