/* Umowy między graczami — wygląd dopasowany do motywu epoki (zmienne --win, --hi, --text, --muted z .wg.skin). */
.float-layer.agreement-layer{pointer-events:none;background:none;align-items:flex-start;justify-content:flex-end;padding:12px}
.float-layer.agreement-notice-layer{pointer-events:none;background:none;align-items:center;justify-content:center;padding:16px}

.agreement-panel.drag-win{
  --ag-bg:var(--win,#111c30);--ag-card:var(--win-2,#17253a);--ag-line:var(--win-line,#3b4a63);
  --ag-text:var(--text,#eef2ff);--ag-muted:var(--muted,#9fb0c7);--ag-hi:var(--hi,#d2aa57);
  pointer-events:auto;width:430px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:12px 14px 14px;
  background:var(--ag-bg);color:var(--ag-text);border:2px solid var(--ag-hi);border-radius:14px;
  box-shadow:0 18px 50px #0009;font:14px/1.45 var(--font-sans,'Segoe UI',sans-serif);
}
.agreement-panel.agreement-collapsed{width:300px}
.agreement-panel.agreement-notice.drag-win{width:380px}
.agreement-panel .drag-bar{flex-shrink:0;min-height:36px;box-sizing:border-box;color:var(--ag-muted);border-bottom-color:var(--ag-line)}
.agreement-panel .drag-body{overflow:auto;overscroll-behavior:contain;min-height:0;padding-right:2px}

.agreement-panel header{position:sticky;top:0;z-index:2;background:var(--ag-bg);display:flex;justify-content:space-between;align-items:center;gap:8px;padding:2px 0 8px}
.agreement-panel h2{margin:0;font-size:1.25rem;line-height:1.2;color:var(--color-gold,#fbbf24)}
.agreement-panel h3{margin:14px 0 6px;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ag-hi);font-weight:700}
.agreement-panel p{margin:6px 0}
.agreement-muted{color:var(--ag-muted);font-size:.9em}.agreement-error{color:#fda4af;font-weight:600}
.agreement-actions{display:flex;flex-wrap:wrap;gap:6px}
.agreement-panel button{min-height:40px;cursor:pointer}
.agreement-panel .btn.ghost{padding:6px 10px}
.agreement-panel .ag-wide{width:100%;margin-top:10px;min-height:44px}
.agreement-notice .btn{flex-shrink:0}

/* gracze: te same kolory co kropki przy graczach */
.ag-dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none;margin:0 2px 0 0}
.ag-dot.ag-p0{background:#3b82f6}.ag-dot.ag-p1{background:#ef4444}
.ag-who{font-weight:700}
.ag-parties{display:inline-flex;align-items:center;gap:5px;flex-wrap:wrap;min-width:0}
.ag-arrow{color:var(--ag-muted);margin:0 2px}

/* wstęp */
.ag-intro{display:flex;flex-direction:column;gap:6px}
.ag-as{margin:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--ag-muted)}
.ag-as select{width:auto;min-width:130px}
.ag-help{border:1px solid var(--ag-line);border-radius:8px;background:var(--ag-card);padding:0 10px}
.ag-help summary{cursor:pointer;padding:9px 0;color:var(--ag-hi);font-weight:600;list-style:none;display:flex;justify-content:space-between;min-height:24px}
.ag-help summary::-webkit-details-marker{display:none}
.ag-help summary::after{content:"＋";opacity:.8}
.ag-help[open] summary::after{content:"－"}
.ag-help p{color:var(--ag-muted);font-size:.9em;margin:0 0 8px}

/* karty umów */
.agreement-panel article.ag-card{border:1px solid var(--ag-line);background:var(--ag-card);border-radius:10px;padding:10px 12px;margin:8px 0}
.agreement-panel article.ag-card-hot{border-color:var(--ag-hi);box-shadow:inset 3px 0 0 var(--ag-hi)}
.ag-card-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ag-badge{display:inline-block;font-weight:800;font-size:.95rem;color:var(--ag-hi);border:1px solid var(--ag-hi);background:color-mix(in srgb,var(--ag-hi) 14%,transparent);border-radius:999px;padding:1px 9px;white-space:nowrap;line-height:1.5}
.ag-what{margin:6px 0 4px;font-size:1.05rem;font-weight:700}
.ag-meta{margin:6px 0 0;display:grid;gap:3px}
.ag-meta li{display:flex;gap:10px;font-size:.92em}
.ag-meta .ag-k{flex:0 0 62px;color:var(--ag-muted)}
.ag-status{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 4px}
.ag-chip{font-size:.8rem;border:1px solid var(--ag-line);border-radius:999px;padding:1px 9px;color:var(--ag-muted);background:color-mix(in srgb,var(--ag-bg) 70%,transparent)}
.ag-chip-on{color:#86efac;border-color:#2f7d4f}.ag-chip-wait{color:#fcd34d;border-color:#8a6a1d}
.ag-fields{margin:6px 0 0}
.ag-fields summary{cursor:pointer;color:var(--ag-muted);font-size:.85rem;min-height:24px}
.ag-fields ul,.ag-fields-inline{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.ag-fields-inline{margin-top:4px}
.ag-fields li{font-size:.8rem;border-radius:6px;background:color-mix(in srgb,var(--ag-text) 9%,transparent);padding:1px 7px}

/* podsumowanie zakończonej umowy */
.ag-recap{margin:8px 0;padding:8px 10px;display:grid;gap:6px;border:1px solid color-mix(in srgb,var(--ag-hi) 45%,transparent);border-radius:8px;background:color-mix(in srgb,var(--ag-hi) 10%,transparent);font-size:.95em;line-height:1.45}
.ag-plus{color:#86efac}.ag-minus{color:#fda4af}

/* zwijana lista zawartych umów (formularz propozycji jest nad nią i zawsze na wierzchu) */
.ag-contracts{margin-top:14px;border-top:1px dashed var(--ag-line);padding-top:2px}
.agreement-panel h3.ag-fold-h{margin:10px 0 6px;font-size:inherit;letter-spacing:0;text-transform:none}
.agreement-panel .ag-fold{width:100%;display:flex;align-items:center;gap:8px;flex-wrap:wrap;text-align:left;padding:8px 12px;min-height:44px;
  border:1px solid var(--ag-line);border-radius:10px;background:var(--ag-card);color:var(--ag-text);font:inherit}
.agreement-panel .ag-fold:hover{border-color:var(--ag-hi)}
.ag-fold-title{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ag-hi);font-weight:700}
.ag-fold-sum{display:inline-flex;flex-wrap:wrap;gap:6px;flex:1;min-width:0}
.ag-fold-sum .ag-chip{padding:0 8px;line-height:1.5}
.agreement-panel .ag-fold{scroll-margin-top:62px}
.ag-fold-icon{margin-left:auto;color:var(--ag-hi);font-weight:700;opacity:.9}

/* formularz */
.ag-form{border-top:1px dashed var(--ag-line);margin-top:12px;padding-top:2px}
.agreement-panel label{display:flex;flex-direction:column;gap:4px;margin:0 0 10px}
.ag-lab{font-size:.85rem;color:var(--ag-muted);display:flex;align-items:center;justify-content:space-between;gap:8px}
.agreement-panel input,.agreement-panel select{width:100%;box-sizing:border-box;background:color-mix(in srgb,var(--ag-bg) 70%,#000);color:var(--ag-text);border:1px solid var(--ag-line);border-radius:8px;padding:8px 8px;font:inherit;min-height:44px}
.agreement-panel input[type=range]{accent-color:var(--ag-hi);padding:0;min-height:44px;background:none;border:0}
.ag-row{display:grid;grid-template-columns:1fr 1.2fr;gap:0 12px}
.ag-row3{grid-template-columns:1fr 1.15fr 1fr;gap:0 8px}.ag-row3 select{font-size:.92rem}
.ag-summary{background:color-mix(in srgb,var(--ag-hi) 10%,transparent);border:1px solid color-mix(in srgb,var(--ag-hi) 45%,transparent);border-radius:8px;padding:8px 10px;margin:4px 0 0;line-height:1.5}

.agreement-panel button:focus-visible,.agreement-panel input:focus-visible,.agreement-panel select:focus-visible,.agreement-panel summary:focus-visible{outline:2px solid var(--ag-hi);outline-offset:2px}

@media(max-width:550px){
  .float-layer.agreement-layer{padding:8px;justify-content:center}
  .agreement-panel.drag-win{width:100%;padding:10px 12px 12px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
  .ag-row3{grid-template-columns:1fr 1fr}
  .ag-row3 label:first-child{grid-column:1 / -1}
}

/* Dodatkowy rzut: oczka 7-9 jako płaski kafelek (kostka 3D ma tylko 6 ścianek) */
.die.die-pips{padding:0;font-size:0}
.die.die-pips .pips{padding:8px}

/* Dodatkowy rzut: kostka 10-ścienna (d10), oczka jako cyfra 1-9 */
.die-d10{position:relative;width:54px;height:54px;filter:drop-shadow(0 4px 5px #0006)}
.die-d10 svg{width:100%;height:100%;display:block;overflow:visible}
.die-d10 .d10-body{fill:#e8eef5;stroke:#0f172a;stroke-width:2;stroke-linejoin:round}
.die-d10 .d10-edge{fill:none;stroke:#94a3b8;stroke-width:1.2}
.die-d10 .d10-num{position:absolute;left:0;right:0;top:15px;text-align:center;font-weight:800;font-size:1.3rem;color:#0f172a;line-height:1}
.die-d10.rolling{animation:d10Spin .45s linear infinite}
.die-d10.lag.rolling{animation-duration:.6s}
.die-d10.landed{animation:d10Land .4s ease-out}
@keyframes d10Spin{0%{transform:rotate(0) scale(.8)}50%{transform:rotate(180deg) scale(.95)}100%{transform:rotate(360deg) scale(.8)}}
@keyframes d10Land{0%{transform:scale(1.25) rotate(-12deg)}100%{transform:scale(1) rotate(0)}}