/* MA Couleur — Notice Iris 234 : pictogrammes et explications destinés au public.
   Couleurs volontairement sobres ; la palette Iris reste seule référence chromatique. */
#guide.iris-info-dialog{
  width:calc(100% - 28px);
  max-width:775px;
  max-height:min(91dvh,920px);
  padding:clamp(22px,3.5vw,40px);
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  background:#F8F6F1;
  color:#302D28;
  border-radius:8px;
  box-shadow:0 18px 75px rgba(28,24,18,.2);
  font-family:'DM Sans',Arial,sans-serif;
}
#guide.iris-info-dialog .eyebrow{margin:0 42px 6px 0;font-size:10px;letter-spacing:2px}
#guide.iris-info-dialog h2{
  font:500 clamp(28px,4vw,39px)/1.12 'Manrope','DM Sans',sans-serif;
  letter-spacing:-1.15px;margin:0 36px 14px 0;
}
#guide.iris-info-dialog h3{
  font:600 15px/1.4 'Manrope','DM Sans',sans-serif;
  margin:0 0 15px;letter-spacing:-.25px
}
#guide .iris-info-intro{font-size:13px;line-height:1.7;margin:0 0 18px;max-width:70ch}
#guide .iris-info-selected{
 display:inline-block;margin:0 0 20px;font-size:10px;letter-spacing:.02em;
 color:#736e64
}
#guide .iris-info-reference{
 display:flex;gap:18px;align-items:center;
 padding:17px 20px;margin:8px 0 23px;
 background:#ebe5d9;border-radius:5px
}
#guide .iris-info-code{
 flex:none;white-space:nowrap;
 font:500 clamp(32px,5vw,46px)/1 'Manrope','DM Sans',sans-serif;
 letter-spacing:-1px;font-variant-numeric:tabular-nums;
 color:#302D28
}
#guide .iris-info-code b{font:inherit;color:#827460}
#guide .iris-info-reference p{font-size:12px;line-height:1.55;margin:2px 0 0}
#guide .iris-info-reference strong{font-size:13px}
#guide .iris-info-code-caption{display:block;font-size:10px;font-weight:600;margin:4px 0 0;letter-spacing:.08em;color:#776E63}
#guide .iris-info-keys{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;margin:0 0 23px}
#guide .iris-info-key{display:flex;flex-direction:column;gap:7px;border:1px solid #dcd6ca;padding:14px 12px;border-radius:5px;min-width:0}
#guide .iris-info-key strong{font-size:12px;line-height:1.3}
#guide .iris-info-key p{font-size:11px;line-height:1.5;margin:0}
#guide .iris-info-glyph{display:flex;align-items:center;justify-content:center;height:75px;max-width:100%;margin-bottom:4px}
#guide .iris-info-compass{position:relative;width:64px;height:64px;flex:none;border:1px solid #b6b0a5;border-radius:50%;background:radial-gradient(circle at center,#f8f6f1 30%,#e9e4da 100%)}
#guide .iris-info-compass::before,#guide .iris-info-compass::after{content:"";position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);background:#aeaaa1}
#guide .iris-info-compass::before{height:1px;width:42px}
#guide .iris-info-compass::after{height:42px;width:1px}
#guide .iris-info-compass b{position:absolute;z-index:1;font-size:8px;font-weight:600;background:#f8f6f1;padding:1px 2px;line-height:1.1}
#guide .iris-info-compass .n{top:-6px;left:50%;transform:translateX(-50%)}
#guide .iris-info-compass .e{right:-13px;top:50%;transform:translateY(-50%)}
#guide .iris-info-compass .s{bottom:-6px;left:50%;transform:translateX(-50%)}
#guide .iris-info-compass .w{left:-13px;top:50%;transform:translateY(-50%)}
#guide .iris-info-lightness{display:flex;align-items:center;gap:5px;justify-content:center}
#guide .iris-info-lightness span{width:17px;height:35px;display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-weight:600;color:#302D28;background:#e8e3da;border:1px solid #d1cabf;border-radius:10px}
#guide .iris-info-lightness span:nth-child(2){background:#d9d4c9}
#guide .iris-info-lightness span:nth-child(3){background:#c5bfb4}
#guide .iris-info-lightness span:nth-child(4){background:#ada599;color:#fff}
#guide .iris-info-lightness span:nth-child(5){background:#8b8277;color:#fff}
#guide .iris-info-lightness span:nth-child(6){background:#554f48;color:#fff}
#guide .iris-info-neutrals{width:132px;max-width:100%;height:64px}
#guide .iris-info-neutrals path{stroke:rgba(48,45,40,.18);stroke-width:1}
#guide .iris-info-materials{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin:8px 0 23px}
#guide .iris-info-material{display:flex;align-items:center;gap:8px;min-width:0;padding:10px;border:1px solid #ddd7ca;border-radius:5px}
#guide .iris-info-material svg{width:22px;height:22px;flex:none;fill:none;stroke:#555047;stroke-width:1.5}
#guide .iris-info-material svg.paint{fill:#92816d;stroke:none}
#guide .iris-info-material span{display:block;min-width:0;line-height:1.25}
#guide .iris-info-material b{display:block;font-weight:600;font-size:11px}
#guide .iris-info-material small{display:block;font-size:10px;color:#746c60;margin-top:3px}
#guide .iris-info-spectre{margin:0 0 23px;padding:13px 15px;background:#f0ece3;border-radius:4px}
#guide .iris-info-spectre p{font-size:11px;line-height:1.6;margin:0}
#guide .iris-info-spectre strong{font-size:12px}
#guide .iris-info-tools{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin:0 0 20px}
#guide .iris-info-tool{display:flex;align-items:start;gap:10px;padding:11px 0;border-bottom:1px solid #e0dacd}
#guide .iris-info-tool svg{width:19px;height:19px;flex:none;fill:none;stroke:#6b645b;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;margin-top:2px}
#guide .iris-info-tool b{font-size:12px}
#guide .iris-info-tool p{font-size:11px;line-height:1.55;margin:2px 0 0}
#guide .iris-info-warning{font-size:11px;line-height:1.65;margin:12px 0 16px;padding:11px 14px;border-left:2px solid #9b9181}
#guide .iris-info-warning b{font-size:11px}
#guide .iris-info-more{font-size:11px;line-height:1.55;margin-top:15px;border-top:1px solid #d8d0c4;padding-top:10px}
#guide .iris-info-more summary{padding:8px 0;font-weight:600;font-size:12px;cursor:pointer}
#guide .iris-info-more p{font-size:11px;line-height:1.55;margin:9px 0}
#guide .iris-info-more ul{padding-left:18px}
#guide .iris-info-dialog-close{position:sticky;z-index:2;float:right;top:0;right:0;margin:-11px -12px 2px 0;background:#f8f6f1;width:34px;height:34px;font-size:22px;color:#302d28}
#guide .iris-info-dialog-close:hover{background:#e9e3d9}
#guideButton .iris-info-button-symbol{display:block;width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.45}
#guideButton .iris-info-button-symbol circle[fill]{stroke:none}
@media(max-width:670px){
 #guide.iris-info-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 22px);padding:20px 17px;border-radius:6px;scrollbar-gutter:auto}
 #guide.iris-info-dialog h2{font-size:26px}
 #guide .iris-info-keys{grid-template-columns:1fr;gap:8px}
 #guide .iris-info-key{display:grid;grid-template-columns:85px 1fr;gap:0px 12px;align-items:center;padding:9px 11px}
 #guide .iris-info-key .iris-info-glyph{grid-row:span 2;margin:0;height:72px}
 #guide .iris-info-compass{width:55px;height:55px}
 #guide .iris-info-key p{font-size:11px}
 #guide .iris-info-materials{grid-template-columns:1fr 1fr;gap:7px}
 #guide .iris-info-tools{grid-template-columns:1fr}
 #guide .iris-info-reference{gap:12px;padding:13px 12px;margin-bottom:18px}
 #guide .iris-info-reference p{font-size:11px}
 #guide .iris-info-code{font-size:30px}
 #guide .iris-info-lightness span{width:10px;height:27px;font-size:8px}
}
@media(prefers-reduced-motion:reduce){#guide .iris-info-dialog-close{scroll-behavior:auto}}

/* Cultural layer: two concise readings beyond the practical colour guide. */
#guide .iris-info-symbolism{margin:4px 0 26px}
#guide .iris-info-symbol-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:0 0 14px}
#guide .iris-info-story{min-width:0;border-top:1px solid #d8d1c5;padding:14px 0 0}
#guide .iris-info-story-head{display:flex;align-items:center;gap:13px;min-height:72px;margin:0 0 9px}
#guide .iris-info-story-icon{width:90px;height:66px;flex:0 0 90px;overflow:visible}
#guide .iris-info-story h4{font:600 14px/1.28 'Manrope','DM Sans',Arial,sans-serif;letter-spacing:-.2px;margin:0}
#guide .iris-info-story h4 span{font-size:12px;font-weight:400;color:#696357}
#guide .iris-info-story p{font-size:11px;line-height:1.7;margin:0}
#guide .iris-info-story em{font-style:italic}
#guide .iris-info-nature{
 display:flex;align-items:flex-start;gap:15px;padding:15px 17px;margin:0;
 background:#eeece4;border-left:2px solid #8c8c78;border-radius:0 5px 5px 0;
}
#guide .iris-info-nature svg{height:55px;width:43px;flex:0 0 43px;color:#757c67}
#guide .iris-info-nature strong{font:600 12px/1.5 'Manrope','DM Sans',sans-serif}
#guide .iris-info-nature p{font-size:11px;line-height:1.7;margin:4px 0 0}
#guide .iris-info-nature em{font-weight:500;font-style:italic}
#guide .iris-info-more a{color:inherit;text-underline-offset:3px}
#guide .iris-info-more a:hover,#guide .iris-info-more a:focus-visible{text-decoration-thickness:2px}
@media(max-width:670px){
 #guide .iris-info-symbol-grid{grid-template-columns:1fr;gap:13px}
 #guide .iris-info-story{padding-top:10px}
 #guide .iris-info-story-head{min-height:58px;margin-bottom:4px}
 #guide .iris-info-story-icon{width:73px;height:54px;flex-basis:73px}
 #guide .iris-info-nature{padding:12px;gap:10px}
 #guide .iris-info-nature svg{width:31px;height:46px;flex-basis:31px}
}