/* Styles for the EE tools (ideas, RQ builder, experiment lab, self-assessment). Uses the site's colour variables. */
.eel-filters,.eel-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:10px 14px;margin:10px 0}
.eel-form label,.eel-filters label,.eel-block{display:flex;flex-direction:column;gap:4px;font-weight:600;font-size:15px}
.eel-form input,.eel-form select,.eel-filters input,.eel-filters select,.eel-block textarea{
  font:inherit;font-weight:400;padding:7px 9px;border-radius:8px;border:1px solid var(--table-header-bg);
  background:var(--table-bg);color:var(--text-color);width:100%;box-sizing:border-box}
.eel-block textarea{resize:vertical}
.eel-inline{flex-direction:row !important;align-items:center}
.eel-inline input{width:auto !important}
.eel-checks{display:flex;flex-wrap:wrap;gap:4px 14px;font-weight:400}
.eel-checks label{flex-direction:row;align-items:center;gap:6px;font-weight:400}
.eel-checks input{width:auto}
.eel-count{opacity:.8;font-size:14.5px;margin:4px 0}
.eel-ideas{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.eel-idea{background:var(--bg-color);border-radius:10px;padding:12px 14px;border-top:4px solid var(--highlight-color);
  box-shadow:0 1px 4px var(--shadow-color);font-size:15px}
.eel-idea h3{margin:0 0 6px;font-size:16.5px}
.eel-idea p{margin:6px 0}
.eel-idea .rq{font-style:italic}
.eel-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:4px}
.eel-tag{font-size:12px;font-weight:700;padding:1px 8px;border-radius:10px;background:var(--table-header-bg);color:var(--highlight-color)}
.eel-tag.k{color:#8e6bd8}
.eel-out{background:var(--bg-color);border-left:6px solid #2ea05a;border-radius:0 10px 10px 0;padding:10px 14px;margin:10px 0;font-size:16.5px;min-height:1.5em}
.eel-results{list-style:none;padding:0;margin:8px 0}
.eel-results li{padding:7px 10px 7px 36px;position:relative;margin:5px 0;background:var(--bg-color);border-radius:8px;font-size:15.5px}
.eel-results li:before{position:absolute;left:10px;top:7px;font-weight:700}
.eel-results li.ok:before{content:"✓";color:#2ea05a}
.eel-results li.warn:before{content:"!";color:#e67e22}
.eel-results li.bad:before{content:"✗";color:#e74c3c}
.eel-results li small{display:block;opacity:.85}
.eel-ghost{background:transparent !important;color:var(--highlight-color) !important;border:1px solid var(--highlight-color) !important}
.eel-controls{border:1px solid var(--table-header-bg);border-radius:10px;padding:8px 14px;margin:10px 0}
.eel-controls legend{font-weight:700;padding:0 6px}
#xp-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:4px 14px}
#xp-controls label{display:flex;gap:8px;align-items:flex-start;font-size:15px}
#xp-controls input{margin-top:4px}
.eel-chart{width:100%;max-width:760px;height:auto;display:block;margin:10px 0}
.eel-chart text{fill:var(--text-color);font-size:12px;font-family:inherit}
.eel-chart .grid{stroke:var(--table-header-bg)}
.eel-legend{display:flex;gap:14px;flex-wrap:wrap;font-size:14px;margin:0 0 6px}
.eel-legend span:before{content:"";display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:5px;vertical-align:-1px;background:var(--c)}
.sa-crit{background:var(--bg-color);border-radius:10px;padding:10px 14px;margin:12px 0}
.sa-crit h3{margin:2px 0 8px;font-size:17px;color:var(--highlight-color)}
.sa-crit h3 small{font-weight:600;opacity:.75;margin-left:6px}
.sa-strand{margin:8px 0 12px}
.sa-strand>b{display:block;margin-bottom:4px}
.sa-opts{display:grid;gap:4px}
.sa-opts label{display:flex;gap:8px;align-items:flex-start;padding:5px 8px;border-radius:8px;cursor:pointer;font-size:15px}
.sa-opts label:hover{background:var(--table-header-bg)}
.sa-opts input{margin-top:4px}
.sa-opts .lv{font-weight:700;min-width:62px;opacity:.8}
.sa-score{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:8px;margin:8px 0}
.sa-score div{background:var(--bg-color);border-radius:10px;padding:8px;text-align:center}
.sa-score b{display:block;font-size:22px;color:var(--highlight-color)}
.sa-score .tot{border:2px solid var(--highlight-color)}
.sa-meter{height:8px;border-radius:4px;background:var(--table-header-bg);overflow:hidden;margin-top:4px}
.sa-meter i{display:block;height:100%;background:var(--highlight-color)}

/* ===== lab blocks (same look as the A1–A4 labs) ===== */
body{--ok:#2e9d4f;--bad:#d64545;--warn:#e8a317;--muted:rgba(127,140,160,.18);--line:var(--table-border)}
body.dark-mode{--ok:#4cc26e;--bad:#ff6b6b}
.lab-card{background:var(--bg-color);border-radius:10px;padding:18px 20px;margin:14px 0 18px;box-shadow:0 1px 4px var(--shadow-color)}
.lab-card>h3{color:var(--highlight-color);font-size:19px;margin:0 0 6px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.lab-card>h3 .kind{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:10px;background:var(--table-header-bg);color:var(--text-color);opacity:.85}
.lab-card>p.how{opacity:.85;margin-bottom:12px;font-size:15.5px}
.lab-row{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start}
.lab-row>*{flex:1 1 300px;min-width:0}
.btn{font:inherit;font-size:15px;font-weight:600;cursor:pointer;border:none;border-radius:8px;padding:8px 15px;margin:6px 6px 4px 0;background:var(--highlight-color);color:#fff;transition:filter .15s,transform .15s}
.btn:hover{filter:brightness(1.1)}.btn:active{transform:scale(.97)}
.btn.ghost{background:var(--table-header-bg);color:var(--text-color)}
.btn:disabled{opacity:.4;cursor:default}.btn.sm{font-size:13.5px;padding:5px 11px}
.lab-in{font:inherit;font-size:15px;background:var(--table-bg);color:var(--text-color);border:1px solid var(--line);border-radius:7px;padding:6px 9px;width:100%;box-sizing:border-box}
.ok{color:var(--ok)}.bad{color:var(--bad)}
.score{font-weight:700;margin-left:6px}
.note{font-size:14.5px;opacity:.85}
.feedback{margin-top:10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.feedback svg{max-width:100%;height:auto}
.ee-say{padding:8px 12px;border-radius:8px;background:var(--table-bg);border-left:4px solid var(--highlight-color);font-size:15px}
.ee-say.ok{border-color:var(--ok)}.ee-say.bad{border-color:var(--bad)}
.srt-item{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:9px 12px;border:1px solid var(--line);border-radius:8px;margin:6px 0;background:var(--table-bg)}
.srt-item .t{flex:1 1 260px;font-size:15.5px}
.srt-opts{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0}
.srt-opt{font:inherit;font-size:13.5px;font-weight:600;cursor:pointer;border:1px solid var(--line);border-radius:16px;padding:4px 11px;background:var(--bg-color);color:var(--text-color)}
.srt-opt.sel{background:var(--highlight-color);color:#fff;border-color:var(--highlight-color)}
.srt-item.right{border-color:var(--ok);box-shadow:inset 4px 0 0 var(--ok)}
.srt-item.wrong{border-color:var(--bad);box-shadow:inset 4px 0 0 var(--bad)}
.srt-why{flex-basis:100%;font-size:14px;opacity:.9;display:none}
.srt-item.checked .srt-why{display:block}
.ord-list{list-style:none;counter-reset:o;margin:6px 0;padding:0}
.ord-list li{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;margin:5px 0;background:var(--table-bg);font-size:15.5px}
.ord-list li::before{counter-increment:o;content:counter(o);flex:0 0 26px;height:26px;border-radius:50%;background:var(--highlight-color);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px}
.ord-list li .t{flex:1}
.ord-list li.right{border-color:var(--ok)}.ord-list li.wrong{border-color:var(--bad)}
.ord-list li button{font-size:13px;padding:2px 8px;cursor:pointer;border-radius:6px;border:1px solid var(--line);background:var(--bg-color);color:var(--text-color)}
details.reveal{margin:8px 0;border:1px solid var(--line);border-radius:8px;background:var(--table-bg)}
details.reveal summary{cursor:pointer;padding:8px 12px;font-weight:600;color:var(--highlight-color)}
details.reveal>div{padding:2px 14px 12px}
.mnemo{border-left:4px solid var(--warn);background:rgba(232,163,23,.1);padding:10px 14px;border-radius:0 8px 8px 0;margin:12px 0;font-size:15.5px}
.mnemo>b.hd{color:var(--warn);display:block;margin-bottom:3px}
.mnemo .big{font-size:19px;font-weight:700;letter-spacing:.02em}
.mnemo .big u{text-decoration:none;color:var(--warn);font-size:23px}
.real{border-left:4px solid var(--ok);background:rgba(46,157,79,.09);padding:10px 14px;border-radius:0 8px 8px 0;margin:12px 0;font-size:15.5px}
.real>b.hd{color:var(--ok);display:block;margin-bottom:3px}
.ee-research{border-left:4px solid #1a9bd7;background:rgba(26,155,215,.09);padding:10px 14px;border-radius:0 8px 8px 0;margin:12px 0;font-size:15.5px}
.ee-research>b.hd{color:#1a9bd7;display:block;margin-bottom:3px}
details.ee-joke{margin:12px 0;border:1px dashed var(--warn);border-radius:10px;background:rgba(232,163,23,.06)}
details.ee-joke summary{cursor:pointer;padding:9px 14px;font-weight:600}
details.ee-joke summary i{color:var(--warn);margin-right:6px}
details.ee-joke>div{padding:0 14px 10px 40px;font-size:15.5px;animation:jokeIn .4s ease-out}
@keyframes jokeIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.bit-spot{margin:8px 0 12px;min-height:4px}
.bit-spot svg{max-width:100%;height:auto}
.ee-intro{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center}
.ee-intro>.ia-lead{flex:1 1 300px;margin:0}
.ee-intro>.bit-spot{flex:1 1 360px;margin:0}
.ee-rng{display:block;font-size:15px;margin:6px 0}
.ee-rng input{accent-color:var(--highlight-color);width:100%;display:block;margin-top:2px}
.eel-chart .grid{stroke:var(--table-header-bg)}
.eel-chart text{fill:var(--text-color);font-size:12px}
/* journey */
.jr-track{position:relative;height:150px;margin:6px 34px 0}
.jr-line{position:absolute;left:0;right:0;top:112px;height:6px;border-radius:3px;background:var(--muted)}
.jr-line i{display:block;height:100%;width:0;border-radius:3px;background:var(--highlight-color);transition:width .8s ease}
.jr-stop{position:absolute;top:100px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;background:none;border:0;cursor:pointer;color:var(--text-color);font:inherit;font-size:12.5px;font-weight:600;width:74px;padding:0}
.jr-stop i{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--table-header-bg);border:2px solid var(--line);font-size:13px;transition:all .3s}
.jr-stop.on i{background:var(--highlight-color);color:#fff;border-color:var(--highlight-color)}
.jr-stop.cur i{box-shadow:0 0 0 5px rgba(26,115,232,.25);transform:scale(1.15)}
.jr-stop span{line-height:1.15;text-align:center}
.jr-bit{position:absolute;top:28px;left:0;transform:translateX(-50%);transition:left .8s ease;width:64px;height:70px;pointer-events:none}
.jr-dot{display:block;width:16px;height:16px;border-radius:50%;background:var(--highlight-color);margin:48px auto 0}
.jr-info{margin-top:44px;padding:10px 14px;border-radius:8px;background:var(--table-bg);border:1px solid var(--line);font-size:15.5px;min-height:48px}
.jr-mile{display:inline-block;font-size:13px;font-weight:700;padding:1px 9px;border-radius:10px;background:rgba(142,107,216,.18);color:#8e6bd8;margin:0 6px}
/* funnel */
.fn-box{display:flex;flex-direction:column;align-items:center;gap:6px;margin:12px 0}
.fn-row{display:flex;gap:10px;align-items:center;padding:9px 14px;border-radius:10px;background:var(--muted);opacity:.45;transition:all .5s ease;flex-wrap:wrap;box-sizing:border-box}
.fn-row.show{opacity:1}
.fn-row.bad{background:rgba(214,69,69,.14)}.fn-row.mid{background:rgba(232,163,23,.16)}.fn-row.ok{background:rgba(46,157,79,.18);box-shadow:0 0 0 2px var(--ok)}
.fn-lv{font-weight:700;min-width:130px}.fn-t{flex:1 1 200px}.fn-tag{font-size:12.5px;font-weight:700;opacity:.8}
/* title page */
.tp-paper{background:#fdfdfb;color:#222;border-radius:4px;box-shadow:0 4px 18px rgba(0,0,0,.25);max-width:460px;margin:10px auto;padding:20px 26px 14px;display:flex;flex-direction:column;align-items:center;gap:8px;font-family:Georgia,serif}
.tp-part{font:inherit;color:inherit;background:none;border:2px solid transparent;border-radius:6px;padding:3px 8px;cursor:pointer;text-align:center}
.tp-part:hover{border-color:#9ab}
.tp-hdr{align-self:flex-end;font-size:11px;opacity:.7}
.tp-title{font-size:19px;font-weight:700;margin-top:26px}
.tp-rq{font-size:13.5px;font-style:italic}
.tp-subj,.tp-wc,.tp-sup,.tp-sch,.tp-fmt{font-size:13.5px}
.tp-pg{font-size:11px;margin-top:30px}
.tp-file{font-family:'Courier New',monospace;font-size:11.5px;background:#e9ecf1;border-radius:4px;align-self:stretch}
.tp-part.hit{border-color:#d64545;background:rgba(214,69,69,.12)}
.tp-part.fine{border-color:#2e9d4f;background:rgba(46,157,79,.1)}
/* reflection meter */
.rf-meter{display:flex;align-items:center;gap:10px;margin:10px 0;font-size:14px;font-weight:600}
.rf-meter .sa-meter{flex:1;height:12px;margin:0}
.rf-meter .sa-meter i{transition:width .4s}
@media (max-width:640px){.jr-stop span{display:none}.jr-track{margin:6px 16px 0}.jr-info{margin-top:20px}.fn-row{width:100%!important}}
.ee-tool span{color:var(--text-color);font-weight:400}