:root {
  --kiss-color-brand: #55ddff;
  --kiss-color-brand-dark: #1f9fc9;
  --kiss-color-brand-light: #7ae7ff;
  --kiss-color-brand-ink: #032431;
  --kiss-color-bg: #04090e;
  --kiss-color-bg-elevated: #07131f;
  --kiss-color-surface: rgba(10,24,38,0.92);
  --kiss-color-surface-hover: rgba(15,30,50,0.95);
  --kiss-color-surface-active: rgba(20,38,60,0.95);
  --kiss-color-surface-input: rgba(0,0,0,0.24);
  --kiss-color-border: rgba(141,226,255,0.2);
  --kiss-color-border-strong: rgba(141,226,255,0.35);
  --kiss-color-divider: rgba(141,226,255,0.08);
  --kiss-color-text: #edf8ff;
  --kiss-color-text-muted: #8fb1c8;
  --kiss-color-text-subtle: #5d7a8a;
  --kiss-color-text-inverse: #032431;
  --kiss-color-coin: #ffd86b;
  --kiss-color-success: #8fffc0;
  --kiss-color-danger: #ffaabb;
  --kiss-color-warning: #ffe09a;
  --kiss-color-info: #8feaff;
  --kiss-color-overlay: rgba(2,6,12,0.72);
  --kiss-color-focus: #6ce2ff;
  --kiss-color-focus-glow: rgba(108,226,255,0.18);
  --kiss-font-size-xs: 12px;
  --kiss-font-size-sm: 14px;
  --kiss-font-size-md: 16px;
  --kiss-font-size-lg: 18px;
  --kiss-font-size-xl: 22px;
  --kiss-font-size-xxl: 28px;
  --kiss-font-size-display: 34px;
  --kiss-font-weight-regular: 400;
  --kiss-font-weight-medium: 500;
  --kiss-font-weight-semibold: 600;
  --kiss-font-weight-bold: 700;
  --kiss-line-tight: 1.2;
  --kiss-line-normal: 1.45;
  --kiss-line-relaxed: 1.6;
  --kiss-font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --kiss-font-mono: ui-monospace, 'SF Mono', Menlo, Monaco, Consolas, monospace;
  --kiss-space-0: 0;
  --kiss-space-1: 4px;
  --kiss-space-2: 8px;
  --kiss-space-3: 12px;
  --kiss-space-4: 16px;
  --kiss-space-5: 20px;
  --kiss-space-6: 24px;
  --kiss-space-8: 32px;
  --kiss-space-10: 40px;
  --kiss-space-12: 48px;
  --kiss-space-16: 64px;
  --kiss-radius-none: 0;
  --kiss-radius-sm: 6px;
  --kiss-radius-md: 10px;
  --kiss-radius-lg: 14px;
  --kiss-radius-xl: 20px;
  --kiss-radius-full: 9999px;
  --kiss-touch-min: 44px;
  --kiss-touch-comfortable: 48px;
  --kiss-z-base: 0;
  --kiss-z-sticky: 100;
  --kiss-z-header: 200;
  --kiss-z-bottomNav: 200;
  --kiss-z-overlay: 900;
  --kiss-z-sheet: 1000;
  --kiss-z-toast: 1100;
  --kiss-z-dialog: 1200;
  --kiss-shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
  --kiss-shadow-md: 0 4px 12px rgba(0,0,0,0.5);
  --kiss-shadow-lg: 0 10px 32px rgba(0,0,0,0.6);
}

/* mobile/theme — tokens.css'i besleyen minimal CSS.
   Tokens çalışma zamanında değil, build sırasında JS'ten
   üretilip (tokensAsCss) prepend edilir. Buradaki kurallar
   token bağımsız temel reset+yardımcılar. */

*, *::before, *::after { box-sizing: border-box; }

button {
  font-family: inherit;
  cursor: pointer;
  border: 0;
  background: transparent;
  color: inherit;
  padding: 0;
}

input, select, textarea {
  font-family: inherit;
  font-size: var(--kiss-font-size-md);
  color: var(--kiss-color-text);
  background: var(--kiss-color-surface);
  border: 1px solid var(--kiss-color-border);
  border-radius: var(--kiss-radius-md);
  padding: var(--kiss-space-3) var(--kiss-space-4);
  min-height: var(--kiss-touch-min);
  outline: none;
  width: 100%;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--kiss-color-focus);
}

.text-muted { color: var(--kiss-color-text-muted); }
.text-subtle { color: var(--kiss-color-text-subtle); }
.text-sm { font-size: var(--kiss-font-size-sm); }
.text-lg { font-size: var(--kiss-font-size-lg); }
.text-xl { font-size: var(--kiss-font-size-xl); }
.text-xxl { font-size: var(--kiss-font-size-xxl); }
.weight-medium { font-weight: var(--kiss-font-weight-medium); }
.weight-semibold { font-weight: var(--kiss-font-weight-semibold); }

.stack { display: flex; flex-direction: column; }
.stack > * + * { margin-top: var(--kiss-space-3); }
.row { display: flex; align-items: center; gap: var(--kiss-space-3); }

.card {
  background: var(--kiss-color-surface);
  border: 1px solid var(--kiss-color-border);
  border-radius: var(--kiss-radius-lg);
  padding: var(--kiss-space-4);
}