/* bricdersi.net ek bileşenler: el diyagramı, deklarasyon tablosu, test, ders notu */
.suit-s,.suit-c{color:#0f172a}.suit-h,.suit-d{color:#dc2626}
.hand{display:inline-block;font-family:"Outfit",system-ui,sans-serif;font-variant-numeric:tabular-nums;line-height:1.5;font-size:1rem;white-space:nowrap}
.hand div{min-height:1.5em}
.deal{display:grid;grid-template-columns:repeat(3,minmax(0,auto));grid-template-rows:auto auto auto;gap:6px 14px;align-items:center;justify-content:start;margin:14px 0;max-width:100%;overflow-x:auto}
.deal .n{grid-column:2;grid-row:1}.deal .w{grid-column:1;grid-row:2}.deal .e{grid-column:3;grid-row:2}.deal .s{grid-column:2;grid-row:3}
.compass{grid-column:2;grid-row:2;width:64px;height:64px;background:#15803d;color:#fff;border-radius:6px;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr;font-weight:700;font-size:.8rem;text-align:center;align-items:center}
.compass span:nth-child(1){grid-column:2;grid-row:1}.compass span:nth-child(2){grid-column:1;grid-row:2}.compass span:nth-child(3){grid-column:3;grid-row:2}.compass span:nth-child(4){grid-column:2;grid-row:3}
.ex-row{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:flex-start;margin:12px 0}
.ex-row .note{flex:1 1 240px;min-width:0}
table.bidding{border-collapse:collapse;margin:10px 0;font-size:.95rem}
table.bidding th,table.bidding td{padding:3px 12px;text-align:left;border-bottom:1px solid var(--border-color)}
table.bidding th{font-size:.78rem;color:var(--text-muted);font-weight:600}
.seq{font-family:"Outfit",system-ui,sans-serif;background:var(--bg-alt);border-radius:8px;padding:10px 14px;margin:10px 0;overflow-x:auto}
.seq div{white-space:nowrap}
.tbl-wrap{overflow-x:auto;margin:12px 0}
.tbl-wrap table{border-collapse:collapse;min-width:280px}
.tbl-wrap th,.tbl-wrap td{border:1px solid var(--border-color);padding:6px 10px;text-align:center}
.tbl-wrap th{background:var(--bg-alt)}
figure.note-fig{margin:16px 0;text-align:center}
figure.note-fig img{max-width:100%;height:auto;border:1px solid var(--border-color);border-radius:8px;background:#fff}
figure.note-fig figcaption{font-size:.85rem;color:var(--text-muted);margin-top:6px}
.lesson-nav{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:28px;padding-top:16px;border-top:1px solid var(--border-color)}
.lesson-nav a{font-weight:600}
.lesson-meta{font-size:.88rem;color:var(--text-muted);margin:-6px 0 16px}
.lesson-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.lesson-list li a{display:block;padding:12px 14px;border:1px solid var(--border-color);border-radius:10px;background:var(--bg-card);text-decoration:none}
.lesson-list li a:hover{border-color:var(--primary)}
.lesson-list .num{font-size:.75rem;color:var(--text-muted);display:block}
/* test */
.quiz-wrap h2{margin-top:28px}
.bq{border:1px solid var(--border-color);border-radius:12px;padding:16px;margin:14px 0;background:var(--bg-card)}
.bq-head{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-size:.8rem;color:var(--text-muted);margin-bottom:8px}
.bq-body{display:flex;flex-wrap:wrap;gap:8px 28px;align-items:flex-start}
.bq-q{font-weight:600;margin:10px 0 8px;color:var(--text-heading)}
.bq-opts{display:flex;flex-wrap:wrap;gap:8px}
.bq-opts button{min-width:64px;min-height:44px;padding:8px 14px;border:1px solid var(--border-color);border-radius:10px;background:var(--bg-alt);font:inherit;font-weight:600;cursor:pointer;color:var(--text-heading)}
.bq-opts button:hover{border-color:var(--primary)}
.bq-opts button.ok{background:#dcfce7;border-color:#16a34a;color:#14532d}
.bq-opts button.no{background:#fee2e2;border-color:#dc2626;color:#7f1d1d}
.bq details{margin-top:10px}
.bq summary{cursor:pointer;color:var(--primary);font-weight:600}
.bq-exp{margin:8px 0 0}
.bq-score{position:sticky;bottom:12px;display:inline-block;background:var(--text-heading);color:#fff;border-radius:999px;padding:6px 14px;font-size:.85rem;margin-top:8px}
.video-embed{position:relative;width:100%;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000;margin:14px 0}
.video-embed iframe,.video-embed button{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-embed button{cursor:pointer;background-size:cover;background-position:center;color:#fff;font-size:1rem;font-weight:700;display:flex;align-items:flex-end;justify-content:flex-start;padding:14px;text-shadow:0 1px 4px rgba(0,0,0,.8)}
.video-embed button::before{content:"▶";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:68px;height:48px;border-radius:12px;background:#dc2626;display:flex;align-items:center;justify-content:center;font-size:1.4rem;text-shadow:none}
.suit-s,.suit-h,.suit-d,.suit-c{font-family:"Segoe UI Symbol","Apple Symbols","DejaVu Sans",system-ui,sans-serif;font-variant-emoji:text}
table.bidding th,table.bidding td{padding:3px 8px}
.bq-body .tbl-wrap{flex:1 1 220px;min-width:0}
figure.note-fig svg.masa{display:block!important;width:100%!important;max-width:340px!important;height:auto!important;margin:0 auto}
