:root{color-scheme:light;--bg:#f6f6ed;--ink:#1d2c23;--muted:#526052;--green:#244b33;--line:#ced5c8;--mono:ui-monospace,Consolas,monospace}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 system-ui,sans-serif}a{color:var(--green);text-underline-offset:.25em}a:focus-visible,summary:focus-visible{outline:2px solid var(--green);outline-offset:5px}.wrap{width:min(1110px,calc(100% - 48px));margin-inline:auto}.foot,.section-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.skip{position:absolute;top:0;left:12px;padding:8px;background:white;transform:translateY(-110%)}.skip:focus{transform:none}.kicker,.index,.kind,dt,.foot{font: .75rem/1.45 var(--mono);letter-spacing:.07em;color:var(--muted)}h1,h2,h3,p,dl,dd{margin:0}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(3.4rem,8.5vw,7.6rem);line-height:.87;letter-spacing:-.07em;margin:22px 0 28px}h1 em{color:var(--green);font-weight:400}h2{font:400 clamp(2.4rem,5vw,4rem)/1.1 Georgia,serif;letter-spacing:-.05em}.section-head{border-bottom:2px solid var(--green);padding-bottom:16px}.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,285px),1fr));gap:16px;padding-top:18px}.card{display:flex;flex-direction:column;gap:14px;padding:20px;border:1px solid var(--line);background:#fbfbf5;min-width:0}.card .activity{margin-top:auto}.index{align-self:flex-end}.kind{display:inline-block;padding:3px 8px;background:#e4ebdb;border-radius:3px}h3{font-size:1.65rem;line-height:1.15;margin:8px 0}.desc{max-width:58ch;color:var(--muted)}.out{display:inline-block;margin-top:12px;font-weight:650}.metrics{display:grid;grid-template-columns:.7fr 1fr 1fr;gap:9px;padding:12px;background:#edf1e4}.metrics dd{font-size:.9rem;overflow-wrap:anywhere}.metrics dt{letter-spacing:0}.status,.note{font-size:.8rem;color:var(--muted);margin-top:8px}.note{margin:14px 0 50px}details{margin-top:10px;font-size:.88rem}summary{cursor:pointer;width:fit-content}.identity{padding:8px 0}.identity dt{margin-top:6px}.foot{padding:20px 0;border-top:1px solid var(--line)}@media(max-width:730px){.wrap{width:calc(100% - 32px)}}
/* Project mosaic */
body{background:#f4f3ed}
.project-section{padding-top:clamp(26px,5vw,62px)}
.project-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));align-items:stretch}
.brand-tile{display:grid;place-items:center;text-align:center;padding:34px 22px;background:#182c29;color:#f8faef;border-radius:10px;min-height:260px}
.brand-tile img{width:104px;height:104px;border:1px solid #698077;border-radius:25px}
.brand-tile h1{font:750 clamp(2.8rem,6vw,4.6rem)/1 system-ui,sans-serif;letter-spacing:-.075em;margin:10px 0}
.brand-tile p{color:#dafa8b;max-width:24ch;margin-inline:auto}
.card{position:relative;border:0;border-radius:10px;padding:23px;background:#e6edfc;gap:15px}
.card:nth-of-type(3n+2){background:#fae8d3}
.card:nth-of-type(3n){background:#e1eee0}
.card .kind{background:#ffffff82}
.card .index{position:absolute;top:24px;right:23px}
.card .identity{padding:6px 0}
.card .out{margin:0}
.card .data-link{font-size:.82rem}
.card h3{overflow-wrap:anywhere}
.card .desc,.card .status{color:#3e5048}
@media(min-width:980px){
  .project-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .brand-tile{grid-column:2;grid-row:1 / span 2}
  .card:first-of-type{grid-column:1;grid-row:1 / span 2}
  .card:nth-of-type(2){grid-column:3;grid-row:1}
  .card:nth-of-type(3){grid-column:3;grid-row:2}
}
@media(min-width:640px) and (max-width:979px){.brand-tile{grid-column:1 / -1}}

.card .kind{max-width:calc(100% - 40px)}
.tile-link{color:var(--card-accent);text-decoration:none}
.tile-link::after{content:"";position:absolute;inset:0;border-radius:10px}

.tile-link:focus-visible{outline:none}
.tile-link:focus-visible::after{outline:2px solid var(--green);outline-offset:3px}
.info-button,.close-button{display:grid;place-items:center;width:36px;height:36px;border:1px solid #526052;border-radius:50%;background:#fff9;color:var(--ink);cursor:pointer;font:700 1.1rem/1 system-ui,sans-serif}
.info-button{position:absolute;right:18px;top:17px;z-index:1;font-family:Georgia,serif}
.info-button:hover,.close-button:hover{background:white}
.info-button:focus-visible,.close-button:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.info-dialog{width:min(540px,calc(100% - 32px));max-height:calc(100% - 32px);padding:28px;border:0;border-radius:20px;background:var(--bg);color:var(--ink);box-shadow:0 12px 48px #182c2940}
.info-dialog::backdrop{background:#182c29a0}
.info-dialog h2{margin:8px 0 12px}
.close-button{position:absolute;right:16px;top:16px}
.dialog-links{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:16px}

/* Each project has a distinct colour, with activity grouped on a light panel. */
.project-grid{gap:20px}
.card{--card-accent:#283d89;isolation:isolate;overflow:hidden;min-height:230px;padding:24px;background:#bac9ff;box-shadow:0 3px 12px #182c2916}
.card:nth-of-type(3n+2){background:#ffb991;--card-accent:#783819}
.card:nth-of-type(3n){background:#c6e77e;--card-accent:#38551a}
.card h3{font-size:clamp(1.8rem,3vw,2.6rem);letter-spacing:-.06em;margin:15px 0 8px}
.card .kind{border:1px solid #182c2955;background:transparent;color:#182c29;border-radius:999px;padding:5px 10px}
.card .metrics{display:flex;flex-wrap:wrap;gap:8px 15px;background:none;border-top:1px solid #182c2929;padding:10px 0 0}
.card .metrics dt{font-size:.68rem;color:var(--card-accent)}.card .metrics dd{font-size:.8rem;font-weight:500;margin-top:1px}
.card .status{font-family:var(--mono);font-size:.68rem}
.tile-link::after{z-index:1}
.tile-link:focus-visible::after{outline-offset:-4px}
.info-button{z-index:2;background:var(--card-accent);color:white;border:0}
.info-button:hover{background:color-mix(in srgb,var(--card-accent),white 12%)}
.info-dialog{max-height:calc(100dvh - 32px);overflow:auto;padding:clamp(22px,5vw,36px)}
.info-dialog .kind{margin-right:40px}
.info-dialog h2{font:750 clamp(1.9rem,5vw,2.9rem)/1.1 system-ui,sans-serif;letter-spacing:-.05em}
.brand-tile{background:radial-gradient(circle at 50% 20%,#36534b,#182c29 62%)}
@media(prefers-reduced-motion:no-preference){.card{transition:box-shadow .18s,transform .18s}.card:has(.tile-link:hover){transform:scale(1.025);box-shadow:0 6px 18px #182c2924}}

.card:nth-of-type(4n+4){background:#ebc7f1;--card-accent:#673775}
@media(min-width:980px){
  .project-grid:has(.card:nth-of-type(4)) .card:first-of-type{grid-row:1}
  .card:nth-of-type(4){grid-column:1;grid-row:2}
}

.mode-link{display:table;margin:20px 0 0 auto;padding:7px 13px;border:1px solid var(--line);border-radius:999px;font: .8rem var(--mono);background:#fff8;text-decoration:none}
.mode-link:hover{background:#e4ebdb}
.project-section .mode-link{margin-top:0}
.semantic-view{padding:20px 0 50px;overflow-wrap:anywhere}
.semantic-view h1{font-size:clamp(2.7rem,7vw,5.3rem)}
.semantic-view>p{color:var(--muted);max-width:65ch}
.semantic-view nav{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 34px}
.term-chip{display:inline-block;margin:2px 0;padding:3px 8px;border-radius:8px;background:#e3eedc;color:var(--green);font: .76rem/1.45 var(--mono);max-width:100%}
.graph-section{margin-top:35px;scroll-margin-top:12px}
.graph-section header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}
.graph-section h2{font-size:clamp(1.7rem,4vw,2.7rem)}
.semantic-view code{color:var(--muted);font-size:.76rem}
.entity-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:12px}
.entity-card{background:#fffaf1;border:1px solid var(--line);border-radius:10px;padding:16px;min-width:0}
.entity-card:target,.graph-section:target header{outline:2px solid var(--green);outline-offset:4px}
.entity-card h3{margin:0 0 5px}
.entity-card dl{margin-top:12px}
.entity-card dt{border-top:1px solid var(--line);padding-top:6px}
.entity-card dt small{margin-left:8px}
.entity-card dd{margin:3px 0 9px}
.entity-definition{margin:8px 0;color:var(--muted);font-size:.94rem}

.card{padding-top:54px}
.card>div:first-child>.kind{
  position:absolute;top:0;left:0;max-width:calc(100% - 42px);
  border:0;border-radius:0 0 10px 0;padding:7px 11px;
  background:var(--card-accent);color:white
}
.card h3{margin:0 0 8px}
.card .info-button{right:0;top:0;border-radius:0 0 0 10px}

.card[data-project]{
  background:radial-gradient(ellipse at 28% 0%,var(--tile-light),var(--tile-dark) 78%);
  color:#fff;
}
[data-project="chemometrics"]{--tile-light:#465ba9;--tile-dark:#202c61;--tile-tint:#bac9ff;--card-accent:#243676}
[data-project="cogniflow"]{--tile-light:#9e532f;--tile-dark:#542b1d;--tile-tint:#ffb991;--card-accent:#653319}
[data-project="qalgorithms"]{--tile-light:#4b702c;--tile-dark:#263d1d;--tile-tint:#c6e77e;--card-accent:#344b1e}
[data-project="streamfind"]{--tile-light:#875493;--tile-dark:#47274f;--tile-tint:#ebc7f1;--card-accent:#563064}
.card[data-project] .tile-link,.card[data-project] .metrics dt,.card[data-project] .status{color:var(--tile-tint)}
.card[data-project] .metrics{border-top-color:#ffffff42}
.card[data-project]>div:first-child>.kind,.card[data-project] .info-button{background:color-mix(in srgb,var(--tile-light),var(--tile-tint) 20%);color:#fff}
.card[data-project] .info-button:hover{background:color-mix(in srgb,var(--tile-light),var(--tile-tint) 30%)}
.card[data-project] .tile-link:focus-visible::after,.card[data-project] .info-button:focus-visible{outline-color:var(--tile-tint)}
.card[data-project] .info-dialog{
  background:radial-gradient(ellipse at 28% 0%,var(--tile-light),var(--tile-dark) 78%);
  color:#fff;border-radius:10px;padding-top:54px
}
.card[data-project] .info-dialog>.kind,.card[data-project] .info-dialog .close-button{
  position:absolute;top:0;border:0;
  background:color-mix(in srgb,var(--tile-light),var(--tile-tint) 20%);color:#fff
}
.card[data-project] .info-dialog>.kind{left:0;border-radius:0 0 10px 0;padding:7px 11px}
.card[data-project] .info-dialog .close-button{right:0;border-radius:0 0 0 10px}
.card[data-project] .info-dialog :is(h2,dt,a){color:var(--tile-tint)}
.card[data-project] .info-dialog .desc{color:#fff}
.info-dialog .identity{margin-top:14px;border-top:1px solid #ffffff42}
.info-dialog .identity dd ul{margin:3px 0 0;padding-inline-start:1.25rem}
.info-dialog .identity li+li{margin-top:4px}

.semantic-view{
  --tile-light:#36534b;--tile-dark:#182c29;--tile-tint:#dafa8b;
  padding-top:12px
}
.semantic-view h1{font:750 clamp(2.5rem,7vw,4.6rem)/1 system-ui,sans-serif;letter-spacing:-.075em}
.semantic-view nav{gap:10px}
.semantic-view nav .term-chip{border:1px solid var(--line);background:#fff8;text-decoration:none}
.semantic-view nav .term-chip:hover{background:#e4ebdb}
.graph-section{
  color:#fff;padding:clamp(14px,3vw,24px);border-radius:10px;
  background:radial-gradient(ellipse at 28% 0%,var(--tile-light),var(--tile-dark) 78%);
  box-shadow:0 3px 12px #182c2916
}
.graph-section h2{font:750 clamp(1.55rem,4vw,2.45rem)/1.15 system-ui,sans-serif;letter-spacing:-.055em}
.graph-section :is(h2,h3,a,code,dt){color:var(--tile-tint)}
.graph-section header>a{border-radius:6px;padding:5px 9px;background:#ffffff14;font-size:.85rem}
.graph-section .entity-card{background:#ffffff0c;border-color:#ffffff30}
.graph-section .entity-card dt{border-top-color:#ffffff30}
.graph-section .entity-definition{color:#fff}
.graph-section .term-chip{background:#0004;color:var(--tile-tint)}
.graph-section .entity-card:target,.graph-section:target header{outline-color:var(--tile-tint)}
.graph-section a:focus-visible{outline-color:var(--tile-tint)}

.collaboration{border-top:1px solid var(--line);padding:18px 0 28px;margin-top:20px}
.project-section .note{margin-bottom:20px}
.collaboration h2{font: .78rem var(--mono);color:var(--muted);letter-spacing:.04em}
.collaboration ul{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:14px 30px}
.collaboration a{display:flex;align-items:center;gap:10px;text-decoration:none;font-size:.82rem}
.collaboration a:hover strong{text-decoration:underline}
.collaboration a span span{display:block;color:var(--muted)}
.collaboration .affiliation-logo{display:block;flex:none;width:146px;height:62px;overflow:hidden}
.collaboration img{display:block;width:100%;height:100%;object-fit:contain}
.collaboration .affiliation-logo:has(img[src$="/iuta.png"]){position:relative;width:68px;height:68px}
.collaboration img[src$="/iuta.png"]{position:absolute;width:133px;height:120px;max-width:none;top:-26px;left:1px}