/* The suggested style of a course (style-ui.js, board gestion-cas approved Oct 24): a chip, a « ? » with the reason, a select to change it. */
.sty-rc{display:block;margin-top:6px;font:600 12px Figtree,system-ui,sans-serif;color:var(--fg);text-decoration:underline;text-underline-offset:2px;background:none;border:0;padding:0;cursor:pointer}
.sty-row{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;vertical-align:middle}
.sty-k{font:500 10.5px/1.2 "JetBrains Mono",ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,#6D5F6F)}
.sty-chip{display:inline-flex;align-items:center;height:20px;padding:0 8px;border:1px solid var(--border-strong,#CFC9D1);border-radius:999px;background:var(--surface,#fff);color:var(--fg,#201A21);font:600 11px/1 Figtree,system-ui,sans-serif;white-space:nowrap}
.sty-chip.mine{border-style:solid;border-color:var(--fg,#201A21)}
.sty-sel{height:26px;padding:0 24px 0 10px;border:1px solid var(--border-strong,#CFC9D1);border-radius:999px;background:var(--surface,#fff) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 4.5l3 3 3-3' fill='none' stroke='%236D5F6F' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 8px center/10px no-repeat;color:var(--fg,#201A21);font:600 12px Figtree,system-ui,sans-serif;appearance:none;-webkit-appearance:none;cursor:pointer}
.sty-sel:focus-visible,.sty-q:focus-visible{outline:2px solid var(--fg,#201A21);outline-offset:2px}
.sty-qw{position:relative;display:inline-flex;align-items:center}
.sty-q{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--border-strong,#CFC9D1);background:var(--surface,#fff);color:var(--fg,#201A21);font:700 11px/15px Figtree,system-ui,sans-serif;text-align:center;cursor:help;user-select:none}
.sty-q:hover{border-color:var(--fg,#201A21)}
.sty-tip{position:absolute;left:26px;top:-8px;z-index:60;width:280px;padding:10px 12px;border-radius:10px;background:#201A21;color:#fff;font:500 12.5px/1.45 Figtree,system-ui,sans-serif;box-shadow:0 10px 30px -10px rgba(32,26,33,.5);display:none;text-align:left;white-space:normal;text-transform:none;letter-spacing:0}
.sty-tip::before{content:"";position:absolute;left:-5px;top:14px;width:10px;height:10px;background:#201A21;transform:rotate(45deg)}
.sty-tip b{display:block;margin-bottom:2px;color:#fff}
.sty-tip small{display:block;margin-top:5px;color:#CFC9D1;font-size:11.5px}
.sty-tip.up{left:50%;top:auto;bottom:26px;transform:translateX(-50%);width:220px}
.sty-tip.up::before{left:50%;top:auto;bottom:-5px;transform:translateX(-50%) rotate(45deg)}
.sty-tip.left{left:auto;right:26px}
.sty-tip.left::before{left:auto;right:-5px}
.sty-qw:hover .sty-tip,.sty-qw:focus-within .sty-tip{display:block}
@media (max-width:600px){.sty-tip{left:-6px;top:26px;width:min(240px,62vw)}.sty-tip::before{left:10px;top:-5px}}
:root[data-theme="dark"] .sty-chip,:root[data-theme="dark"] .sty-sel,:root[data-theme="dark"] .sty-q{background:var(--surface);color:var(--fg)}