/* Renkler ui tokens.css degiskenlerinden (kontrast: tests/contrast.test.ts ile hesaplanir, AA 4.5:1). */
body { margin: 0; line-height: 1.5; background: var(--vt-bg); color: var(--vt-text); font-family: system-ui, sans-serif; }
header { padding: .5rem 1rem 0; }
h1 { margin: 0; font-size: var(--vt-text-xl); }
.skip { position: absolute; inset-inline-start: .5rem; inset-block-start: -4rem; background: var(--vt-accent); color: var(--vt-on-accent); padding: .5rem 1rem; z-index: 10; }
.skip:focus { inset-block-start: .5rem; }
a { color: var(--vt-accent); }
.layout { display: grid; grid-template-columns: 18rem 1fr; min-height: 100vh; }
nav.sessions { border-inline-end: 1px solid var(--vt-border); padding: 1rem; overflow-y: auto; }
nav.sessions h2 { font-size: var(--vt-text-lg); margin-block-start: 0; }
nav.sessions ul { list-style: none; padding: 0; margin: 0; }
nav.sessions a { display: block; padding: .5rem; min-height: 2.75rem; }
nav.sessions a[aria-current="page"] { font-weight: 600; text-decoration: none; }
main { padding: 1rem; max-width: 60rem; }
.msg { margin-block: 1rem; padding: .75rem 1rem; border-radius: .5rem; border: 1px solid var(--vt-border); background: var(--vt-surface); overflow-wrap: anywhere; }
.msg.user { background: var(--vt-surface-sunken); }
.msg h2 { font-size: var(--vt-text-md); margin: 0 0 .25rem; color: var(--vt-text-muted); }
.msg pre.plain { white-space: pre-wrap; font: inherit; margin: 0; }
.card { border: 2px solid var(--vt-accent); background: var(--vt-surface); border-radius: .5rem; padding: .75rem 1rem; margin-block: 1rem; }
.card h2 { font-size: var(--vt-text-lg); margin: 0 0 .5rem; }
button, select, textarea, input { font: inherit; min-height: 2.75rem; color: var(--vt-text); background: var(--vt-surface); border: 1px solid var(--vt-border); border-radius: .375rem; }
button { padding: .25rem .9rem; cursor: pointer; }
:focus-visible { outline: 3px solid var(--vt-focus); outline-offset: 2px; }
textarea { width: 100%; box-sizing: border-box; }
#live { white-space: pre-wrap; }
.vt-widget dl, .vt-widget dd { margin: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 48rem) {
  .layout { grid-template-columns: 1fr; }
  nav.sessions { border-inline-end: 0; border-block-end: 1px solid var(--vt-border); max-height: 40vh; }
}
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }
.veri-list { list-style: none; padding: 0; }
.veri-list a { display: inline-block; padding: .5rem 0; min-height: 2.75rem; }
.veri-scroll { overflow-x: auto; max-width: 100%; }
.veri-scroll table { border-collapse: collapse; width: 100%; }
.veri-scroll caption { text-align: start; font-weight: 600; padding-block: .5rem; }
.veri-scroll th, .veri-scroll td { border: 1px solid var(--vt-border); padding: .4rem .6rem; text-align: start; overflow-wrap: anywhere; }
.veri-scroll th { background: var(--vt-surface-sunken); }
.veri-chart { list-style: none; padding: 0; }
.veri-chart li { display: flex; gap: .75rem; align-items: center; padding-block: .25rem; }
.veri-chart meter { flex: 1; min-width: 6rem; }
.card dl > div { display: flex; gap: .75rem; }
.card dt { font-weight: 600; }
.card dd { margin: 0; overflow-wrap: anywhere; }
/* Yonetim (P8.6) */
.manage-head { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; align-items: center; padding: .5rem 1rem; border-block-end: 1px solid var(--vt-border); }
.manage-head p { margin: 0; }
.manage-nav { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem 1rem; padding: 0; margin: 0; }
.manage-nav a { display: inline-block; padding: .5rem 0; min-height: 2.75rem; box-sizing: border-box; }
.manage-nav a[aria-current="page"] { font-weight: 600; text-decoration: none; }
.bell { position: relative; }
#bell-panel { position: absolute; inset-inline-start: 0; z-index: 5; min-width: 18rem; max-width: 90vw; background: var(--vt-surface); border: 1px solid var(--vt-border); border-radius: .5rem; padding: .75rem; }
#bell-list { list-style: none; margin: 0 0 .5rem; padding: 0; max-height: 50vh; overflow-y: auto; }
#bell-list li { padding: .25rem 0; overflow-wrap: anywhere; }
#bell-list li.unread { font-weight: 600; }
.toast { position: fixed; inset-inline: 1rem; inset-block-end: 1rem; padding: 0; max-width: 40rem; }
.toast:not(:empty) { padding: .75rem 1rem; background: var(--vt-surface); border: 2px solid var(--vt-accent); border-radius: .5rem; }
.scroll { overflow-x: auto; max-width: 100%; }
.scroll table { border-collapse: collapse; width: 100%; }
.scroll th, .scroll td { border: 1px solid var(--vt-border); padding: .4rem .6rem; text-align: start; overflow-wrap: anywhere; vertical-align: top; }
.scroll thead th { background: var(--vt-surface-sunken); }
.actions button, .actions a { margin-inline-end: .5rem; }
fieldset { border: 1px solid var(--vt-border); margin-block: 1rem; }
.kv > div { display: flex; gap: .75rem; padding-block: .15rem; }
.kv dt { font-weight: 600; min-width: 12rem; }
.kv dd { margin: 0; }
pre.diff { white-space: pre-wrap; overflow-wrap: anywhere; border: 1px solid var(--vt-border); padding: .5rem; background: var(--vt-surface-sunken); }
pre.diff .add { font-weight: 600; }
pre.diff .del { text-decoration: line-through; }
html { scroll-padding-block-end: 5rem; }
button { touch-action: manipulation; }
.scroll td, .kv dd { font-variant-numeric: tabular-nums; }
.chat-head { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; align-items: center; justify-content: space-between; padding-block-end: .5rem; }
main.auth { max-width: 28rem; margin-inline: auto; padding-block: 2rem; }
main.auth input { width: 100%; box-sizing: border-box; padding-inline: .5rem; }
main.auth h2 { font-size: var(--vt-text-lg); }
main.auth a.sso { display: inline-block; box-sizing: border-box; min-height: 2.75rem; padding: .6rem .9rem; color: var(--vt-text); background: var(--vt-surface); border: 1px solid var(--vt-border); border-radius: .375rem; text-decoration: none; }
.approval pre.approval-summary { white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; margin: .5rem 0; }
.field { margin-block: .75rem; }
.field .hint { display: block; color: var(--vt-text-muted); font-size: .875rem; }
.field input[type="number"] { min-width: 10rem; max-width: 100%; }
#sandbox-alert:empty { display: none; }
.crumbs { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem .5rem; padding: 0; margin: 0 0 1rem; }
.crumbs li + li::before { content: "/"; margin-inline-end: .5rem; color: var(--vt-text-muted); }
pre.file { white-space: pre-wrap; overflow-wrap: anywhere; border: 1px solid var(--vt-border); padding: .5rem; background: var(--vt-surface-sunken); max-height: 32rem; overflow: auto; }