    .contracts-layout {
      display: grid;
      grid-template-columns: 1fr 320px;
      gap: 24px;
      align-items: start;
    }
    .contract-slots-grid {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 12px;
      margin-bottom: 20px;
    }
    .contract-slot {
      aspect-ratio: 1;
      background: var(--surface2);
      border: 2px dashed var(--border2);
      border-radius: var(--r-lg);
      display: flex; flex-direction: column;
      align-items: center; justify-content: center;
      gap: 6px; cursor: pointer;
      transition: all .2s;
      position: relative; overflow: hidden;
    }
    .contract-slot:hover { border-color: var(--primary); background: var(--primary-dim); }
    .contract-slot.filled {
      border-style: solid;
      border-color: rgba(75,124,255,.4);
      background: var(--surface3);
      cursor: default;
    }
    .contract-slot__icon { font-size: 24px; color: var(--text3); }
    .contract-slot__text { font-size: 11px; color: var(--text3); text-align: center; }
    .contract-slot__img { width: 70px; height: 56px; object-fit: contain; }
    .contract-slot__name { font-size: 10px; font-weight: 600; text-align: center; padding: 0 4px; }
    .contract-slot__price { font-size: 11px; font-weight: 700; color: var(--warning); }
    .contract-slot__remove {
      position: absolute; top: 4px; right: 4px;
      width: 18px; height: 18px;
      background: var(--danger); border-radius: 50%;
      color: #fff; font-size: 10px; font-weight: 700;
      display: flex; align-items: center; justify-content: center;
      cursor: pointer; opacity: 0; transition: opacity .15s;
    }
    .contract-slot.filled:hover .contract-slot__remove { opacity: 1; }

    .contracts-panel {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--r-xl);
      padding: 24px;
    }

    .param-row {
      display: flex; justify-content: space-between; align-items: center;
      padding: 10px 0; border-bottom: 1px solid var(--border);
      font-size: 14px;
    }
    .param-row:last-child { border-bottom: none; }
    .param-row__label { color: var(--text3); }
    .param-row__val { font-weight: 600; }

    .contract-btn {
      width: 100%; padding: 16px;
      background: linear-gradient(135deg, var(--primary), var(--accent));
      border-radius: var(--r-lg);
      font-size: 16px; font-weight: 700; color: #fff;
      cursor: pointer; transition: all .25s;
      box-shadow: 0 6px 24px rgba(75,124,255,.35);
    }
    .contract-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 32px rgba(75,124,255,.5); }
    .contract-btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }

    .inv-panel {
      background: var(--surface);
      border: 1px solid var(--border);
      border-radius: var(--r-xl);
      overflow: hidden;
    }
    .inv-panel__head {
      padding: 16px 20px;
      border-bottom: 1px solid var(--border);
      display: flex; align-items: center; justify-content: space-between;
    }
    .inv-panel__grid {
      display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px;
      padding: 16px; max-height: 360px; overflow-y: auto;
    }
    .inv-mini {
      background: var(--surface2);
      border: 1px solid var(--border);
      border-radius: var(--r-sm); padding: 8px;
      cursor: pointer; text-align: center; transition: all .15s;
      position: relative;
    }
    .inv-mini:hover { border-color: var(--primary); transform: translateY(-1px); }
    .inv-mini img { width: 64px; height: 48px; object-fit: contain; }
    .inv-mini__name { font-size: 10px; font-weight: 600; line-height: 1.3; margin-bottom: 2px; }
    .inv-mini__price { font-size: 10px; color: var(--warning); font-weight: 700; }

    .recent-wins { display: flex; flex-direction: column; gap: 8px; }
    .recent-win {
      display: flex; align-items: center; gap: 12px;
      padding: 10px 14px;
      background: var(--surface2);
      border: 1px solid var(--border);
      border-radius: var(--r-md);
    }
    .recent-win__avatar {
      width: 32px; height: 32px; border-radius: 50%;
      background: linear-gradient(135deg, var(--primary), var(--accent));
      display: flex; align-items: center; justify-content: center;
      font-size: 14px; font-weight: 700; flex-shrink: 0;
    }
    .recent-win img { width: 48px; height: 36px; object-fit: contain; }
    .recent-win__skin { flex: 1; }
    .recent-win__user { font-size: 12px; color: var(--text3); }
    .recent-win__name { font-size: 13px; font-weight: 600; }
    .recent-win__price { font-size: 13px; font-weight: 700; color: var(--success); }

    .chance-bar { height: 8px; background: var(--surface3); border-radius: 4px; margin-top: 8px; overflow: hidden; }
    .chance-bar__fill { height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--primary), var(--accent)); transition: width .6s var(--ease-out); }

    @media (max-width: 900px) { .contracts-layout { grid-template-columns: 1fr; } }
    @media (max-width: 600px) { .contract-slots-grid { grid-template-columns: repeat(4, 1fr); } .inv-panel__grid { grid-template-columns: repeat(3, 1fr); } }
