/* Suites logiques 0.9.366 : styles autonomes, aucune modification des autres ateliers. */
#view-suites:not([hidden]){display:flex;flex-direction:column;flex:1;min-height:0;gap:8px;font-size:12px;overflow:hidden}
#view-suites [hidden]{display:none!important}
#view-suites button,#view-suites input,#view-suites select{font:inherit}
#view-suites h1{font-size:19px;white-space:nowrap}
#view-suites h2{font-size:15px;margin:0 0 12px}
.sui-muted{font-size:11px;color:#6b7e8c}


.sui-icon,.sui-button{display:inline-flex;align-items:center;justify-content:center;border:1px solid #dae2e5;border-radius:10px;background:#fff;color:#193d56;padding:9px 11px;min-height:35px;cursor:pointer;font-weight:700}
.sui-icon{width:37px;padding:0;font-size:19px}
.sui-icon:disabled{opacity:.3;cursor:default}
.sui-primary{background:#ffcb26;border-color:#e9ac13}
.sui-workspace{flex:1;min-height:0;min-width:0;display:grid;grid-template-columns:var(--ef-left-current,var(--ef-library-width)) minmax(0,1fr) var(--ef-right-current,var(--ef-parameters-width));gap:var(--ef-activity-gap)}
.sui-library,.sui-preview,.sui-settings{min-width:0;min-height:0;background:#fff;border:1px solid #eaddc8;border-radius:var(--ef-activity-radius);padding:14px;overflow:hidden;display:flex;flex-direction:column}
.sui-library{overflow:hidden}
.sui-library>.sui-library-items{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin}



#sui-search{width:100%;border:1px solid #e4dfd6;border-radius:12px;padding:10px;margin-bottom:9px}
.sui-resource.is-used{border:2px solid #2e996b}
.sui-tick{position:absolute;right:3px;top:3px;width:19px;height:19px;display:grid;place-items:center;font-size:14px;color:#fff;background:#23865d;border-radius:50%;font-style:normal}
.sui-upload{margin-top:8px;border:1px dashed #adc0cb;border-radius:11px;padding:10px;text-align:center;cursor:pointer;font-weight:700}
.sui-upload input{display:none}
.sui-preview-head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:30px;margin-bottom:8px}
.sui-preview-scroll{background:#f0f3f3;flex:1;min-height:0;overflow:auto;border-radius:13px;padding:14px}
.sui-board{display:flex;flex-direction:column;align-items:center;gap:15px;width:100%}
.sui-settings{display:grid;grid-template-columns:minmax(0,1fr) var(--ef-rail-width);grid-template-rows:auto minmax(0,1fr);gap:8px}
.sui-settings>h2{grid-column:1;grid-row:1}
.sui-settings-scroll{grid-column:1;grid-row:2;min-height:0;overflow:auto;padding:0 4px 5px 0}
.sui-rail{grid-column:2;grid-row:1/3;display:flex;align-items:center;flex-direction:column;gap:5px;border:1px solid #ecb132;background:#fff9ec;border-radius:13px;padding:5px 3px}
.sui-rail button{width:34px;min-height:40px;border:1px solid #e4d5ba;background:#fff;border-radius:10px;font-size:20px;cursor:pointer}
.sui-rail button[aria-pressed=true]{background:#ffc925;border-color:#e7aa06}
.sui-section{display:flex;flex-direction:column;gap:13px;padding-bottom:12px}
.sui-section label{display:flex;flex-direction:column;gap:6px;font-size:11px;font-weight:700;color:#536a80}
.sui-section label.sui-check{flex-direction:row;align-items:center;gap:8px}
.sui-section input[type=text],.sui-section input[type=number],.sui-section select{background:white;min-width:0;width:100%;padding:10px;border:1px solid #e3ddd1;border-radius:11px;color:#173b5b}
.sui-section input[type=range]{width:100%;accent-color:#ebad12}
.sui-section p{font-size:12px;color:#60778b;margin:0;line-height:1.45}
.sui-switch,.sui-two-options{display:flex;justify-content:space-between;align-items:center;gap:6px}
.sui-two-options button{flex:1}
.sui-two-options button[aria-pressed=true]{background:#fff3c7;border-color:#e6b02b}
.sui-print-notice{margin:0;font-size:11px;color:#3f6d53}
.sui-print-notice.is-warning{color:#906218}
#sui-print:disabled{opacity:.5;cursor:not-allowed}
.sui-subheading{font-weight:700!important;color:#203d57!important;border-bottom:1px solid #e9d5a1;padding-bottom:6px}
.sui-assign{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.sui-custom-pattern-wrap{display:flex;flex-direction:column;gap:5px}
.sui-custom-pattern-wrap[hidden]{display:none!important}
.sui-custom-pattern-wrap input{text-transform:uppercase;letter-spacing:.14em;font-weight:700}
.sui-custom-pattern-wrap p{margin:0;font-size:11px}
.sui-slot{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;background:#fff;border:1px solid #d9e3e8;border-radius:11px;padding:8px 3px;cursor:pointer}
.sui-slot.is-selected{background:#fff5d0;border-color:#e7a817;outline:1px solid #e7a817}
.sui-slot strong{font-size:15px}
.sui-slot small{font-size:10px;color:#5e7282;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sui-symbol{width:100%;height:100%;min-width:0;min-height:0;display:grid;place-items:center}
.sui-symbol img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain}
.sui-symbol-placeholder{font-weight:800;color:#afb8c0;font-size:24px}
.sui-slot .sui-symbol{width:55px;height:55px}
.sui-sign{width:100%;height:100%;min-width:0;min-height:0;display:grid;place-items:center;line-height:1;color:inherit}
.sui-sign>svg,.sui-sign>img.sui-custom-forme{display:block;width:80%;height:80%;max-width:80%;max-height:80%;object-fit:contain}
.sui-cell:has(.sui-sign),.sui-play-cell:has(.sui-sign),.sui-cut-card:has(.sui-sign),.sui-play-choice:has(.sui-sign){padding:0}
.sui-sign>span{line-height:1}
.sui-sign-picker{display:flex;flex-direction:column;gap:9px}
.sui-color-target{font-size:11px;color:#203d57;margin-top:2px}
.sui-signs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;max-height:185px;overflow-y:auto}
.sui-sign-choice{height:38px;min-width:0;background:#fff;border:1px solid #d9e2e7;border-radius:8px;cursor:pointer;padding:4px;display:grid;place-items:center}
.sui-sign-choice.is-selected{background:#fff3ca;border-color:#e8ae0c}
.sui-color-row{display:flex;flex-wrap:wrap;align-items:center;gap:4px}
.sui-tone{font-weight:700;font-size:10px;margin-right:5px}
.sui-swatch{height:18px;min-width:18px;border:1px solid #bccad3;border-radius:50%;padding:0;cursor:pointer}
.sui-swatch.is-selected{outline:2px solid #db9f16;outline-offset:2px}
/* Le DOM de la carte est partagé entre aperçu, jeu et impression. */
.sui-sheet{width:100%;max-width:680px;min-width:0;aspect-ratio:210/297;box-sizing:border-box;display:flex;flex-direction:column;gap:12px;overflow:hidden;box-shadow:0 2px 14px #bdc8cb40}
.sui-sheet.is-landscape{aspect-ratio:297/210;max-width:960px}
.sui-instruction{text-align:center;font-size:clamp(11px,1.2vw,17px);font-weight:700;flex:0 0 auto}
.sui-exercises{display:grid;grid-template-columns:repeat(var(--sui-cols,1),minmax(0,1fr));grid-template-rows:repeat(var(--sui-rows,2),minmax(0,1fr));flex:1;min-height:0;min-width:0;gap:10px}
.sui-exercise{display:flex;flex-direction:column;justify-content:center;min-width:0;min-height:0;padding:9px;overflow:hidden;border-radius:8px}
.sui-exercise.has-border{border:1px dashed #b7c8d4}
.sui-exercise[role=button]{cursor:pointer}
.sui-exercise.is-selected{outline:2px solid #258dcc;outline-offset:-2px;background:#eef9ff60}
.sui-sequence{display:grid;grid-template-columns:repeat(var(--sui-length,8),minmax(0,1fr));align-items:center;gap:3px;min-height:0;width:100%;box-sizing:border-box}
.sui-cell{aspect-ratio:1/1;min-height:0;min-width:0;width:100%;display:grid;place-items:center;border:1px solid #c6d3de;background:white;border-radius:5px;padding:2px;overflow:hidden;box-sizing:border-box}
.sui-cell.is-hole{border:2px dashed #e5a800;background:#fff9df}
.sui-question{color:#cf9d28;font-size:clamp(15px,2vw,35px);font-weight:800}
.sui-sheet button.sui-cell{cursor:pointer}
.sui-sheet button.sui-cell:hover{border-color:#ea9f00}
.sui-cut-card{box-sizing:border-box;border:1px dashed #9daeb9;padding:2mm;display:grid;place-items:center;min-width:0;min-height:0;overflow:hidden;background:white}
.sui-cut-card .sui-symbol{width:100%;height:100%;min-height:0;min-width:0}
.sui-play{display:flex;flex-direction:column;align-items:center;gap:18px;background:white;border-radius:14px;padding:22px;width:100%;max-width:720px}
.sui-play h3{margin:0;text-align:center;font-size:18px}
.sui-play-sequence{width:100%;display:grid;grid-template-columns:repeat(var(--sui-length,8),minmax(0,1fr));gap:5px}
.sui-play-cell{min-width:0;aspect-ratio:1/1;border:1px solid #c7d4de;border-radius:7px;background:white;padding:3px;overflow:hidden;cursor:pointer;display:grid;place-items:center}
.sui-play-cell.is-hole{border:2px dashed #e9a800;background:#fff8e9}
.sui-play-cell:disabled{cursor:default}
.sui-play-bank{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:9px}
.sui-play-bank strong{width:100%;text-align:center}
.sui-play-choice{width:66px;height:66px;border:1px solid #b9cdd8;border-radius:10px;background:#fff;display:grid;place-items:center;cursor:grab;padding:7px}
.sui-play-choice[aria-pressed=true]{border:3px solid #e4a700;background:#fffae7}
.sui-play-controls{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.sui-result{font-size:17px;font-weight:700;text-align:center}
#view-suites button:focus-visible,#view-suites select:focus-visible,#view-suites input:focus-visible{outline:3px solid #edb51d;outline-offset:2px}
@media(max-width:1100px){
.sui-workspace{grid-template-columns:var(--ef-left-current,var(--ef-library-width)) minmax(0,1fr) var(--ef-right-current,var(--ef-parameters-width));gap:var(--ef-activity-gap)}
.sui-library,.sui-preview,.sui-settings{padding:9px}

}
@media(max-width:800px){
#view-suites:not([hidden]){overflow:auto}
.sui-workspace{display:flex;flex-direction:column;min-height:unset}
.sui-preview{order:0}
.sui-library{order:1}
.sui-settings{order:2}
.sui-preview-scroll{min-height:300px}
.sui-settings{min-height:310px}
.sui-settings-scroll{max-height:420px}

}
@media print{
 body:has(#print-stage.efpv-native-print){background:white!important;height:auto!important;overflow:visible!important;margin:0!important;padding:0!important}
 #print-stage.efpv-native-print{display:block!important;width:auto!important;margin:0!important;padding:0!important}
 #print-stage.efpv-native-print .sui-sheet{max-width:none!important;max-height:none!important;aspect-ratio:auto!important;box-shadow:none!important;margin:0!important;padding:var(--ef-page-padding-sui,8mm)!important;print-color-adjust:exact;-webkit-print-color-adjust:exact}
 
 
 #print-stage.efpv-native-print .sui-instruction{font-size:16pt!important}
 #print-stage.efpv-native-print .sui-exercises{gap:3mm!important}
 #print-stage.efpv-native-print .sui-exercise{padding:2mm!important}
 #print-stage.efpv-native-print .sui-exercise.is-selected{outline:none!important;background:white!important}
 #print-stage.efpv-native-print .sui-cell{border:1px solid #b8c7d0!important}
 #print-stage.efpv-native-print .sui-cell.is-hole{border:2px dashed #bd9b4b!important;background:white!important}
}

/* Règle 14 : une case vise directement son élément A/B/C… ; ? conserve le masquage manuel. */
#view-suites .sui-cell.sui-direct-zone{position:relative;cursor:pointer;overflow:visible}
#view-suites .sui-cell.sui-direct-zone.is-target{outline:2px solid #268bc0;outline-offset:-2px}
#view-suites .sui-cell.sui-direct-zone:hover,#view-suites .sui-cell.sui-direct-zone:focus-visible{outline:2px solid #e5ab1d;outline-offset:-2px}
#view-suites .sui-hole-toggle{position:absolute;top:0;right:0;z-index:2;min-width:15px;height:15px;padding:0;
 font:700 11px/1 Arial,sans-serif;border:1px solid #dab02b;border-radius:3px;color:#174260;background:#fff2c9;cursor:pointer}
#view-suites .sui-hole-toggle:hover{background:#ffce49}
@media print{#print-stage .sui-hole-toggle{display:none!important}}

/* Règle 20 : les couches restent indépendantes, mais une seule composition
   CAA est utilisée pour anciens et nouveaux éléments dans les suites. */
.sui-symbol>.ef-caa-layers{width:100%;height:100%;min-height:0;min-width:0}
.sui-symbol .ef-caa-layer-text{max-width:100%;overflow-wrap:anywhere}