:root{
  --sidebar: 255px;
  --text: #111;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#fff;color:var(--text);font-family:Arial, Helvetica, sans-serif;}
body{min-height:100vh;}
a{color:inherit;text-decoration:none}
.site{display:grid;grid-template-columns:var(--sidebar) 1fr;min-height:100vh;}
.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);padding:38px 28px 30px;background:#fff;overflow-y:auto;z-index:3;}
.name{margin:0 0 40px;}
.stamp{display:block;width:72px;height:auto;}
.group-title{font-size:12px;letter-spacing:.18em;margin:0 0 14px;text-transform:none;}
.years{margin-top:14px;display:flex;flex-direction:column;gap:9px;padding-left:0;}
.years a{font-size:12px;letter-spacing:.13em;line-height:1;}
.topbar{position:absolute;top:0;left:var(--sidebar);right:0;height:52px;display:flex;align-items:center;justify-content:flex-end;padding:0 22px;background:#fff;z-index:2;}
.topnav{display:flex;align-items:center;gap:24px;white-space:nowrap;}
.topnav a{font-size:11px;letter-spacing:.16em;text-transform:none;}
.main{grid-column:2;min-height:100vh;display:flex;align-items:center;justify-content:flex-start;padding:60px 38px 24px 82px;}
.cover-wrap{width:max-content;max-width:100%;display:flex;flex-direction:column;align-items:center;}
.cover-link{display:block;max-width:100%;cursor:e-resize;}
.cover{display:block;max-width:100%;max-height:calc(100vh - 112px);width:auto;height:auto;object-fit:contain;}
.caption{font-family:Georgia, 'Times New Roman', serif;font-size:13px;margin-top:16px;letter-spacing:.01em;}
.hint{font-size:11px;line-height:1;margin-top:8px;letter-spacing:.08em;font-family:Arial, Helvetica, sans-serif;}
.topnav a:hover,.years a:hover,.name a:hover{opacity:.55;}
@media (max-width: 1050px){
  :root{--sidebar:190px}
  .sidebar{padding:30px 22px}
  .name{margin-bottom:32px}
  .stamp{width:64px}
  .topbar{height:auto;min-height:52px;padding:12px 22px}
  .topnav{gap:15px;flex-wrap:wrap;justify-content:flex-end}
  .topnav a{font-size:10px}
  .main{padding:66px 24px 24px 72px}
}
@media (max-width: 720px){
  .site{display:block}
  .sidebar{position:static;width:auto;padding:20px;border-bottom:1px solid #e5e5e5}
  .name{margin-bottom:20px}
  .stamp{width:58px}
  .years{margin-top:14px;flex-direction:row;flex-wrap:wrap;gap:10px 15px}
  .topbar{position:static;padding:16px 20px;border-bottom:1px solid #e5e5e5;justify-content:flex-start}
  .topnav{justify-content:flex-start;gap:12px 16px}
  .main{min-height:auto;padding:24px 16px 36px}
  .cover{max-height:none;width:100%}
}

    .landing-content{
      display:flex;
      align-items:flex-start;
      gap:92px;
    }
    .letter{
      width:min(390px, 30vw);
      font-family:Arial, Helvetica, sans-serif;
      font-size:14px;
      line-height:1.55;
      padding-top:0;
      padding-bottom:60px;
    }
    .letter p{margin:0 0 1.15em;}
    .letter a{
      color:inherit;
      text-decoration:underline;
      text-underline-offset:2px;
    }
    .letter strong{font-weight:700;}
    .letter-signoff{margin-top:1.7em;}
    .letter-links{margin-top:1.7em;line-height:1.8;}
    @media (max-width: 1050px){
      .landing-content{gap:56px;}
      .letter{width:min(330px, 31vw);font-size:13px;}
    }
    @media (max-width: 760px){
      .landing-content{display:block;}
      .letter{
        width:auto;
        max-width:520px;
        margin-top:42px;
        font-size:14px;
      }
    }

/* shared inner-page additions */
.inner-main {
  padding-top: 2px;
  max-width: 760px;
}
.inner-main h1 {
  font: inherit;
  font-weight: 400;
  margin: 0 0 36px;
}
.cv-section {
  margin: 0 0 34px;
}
.cv-section h2 {
  font: inherit;
  font-weight: 400;
  margin: 0 0 12px;
}
.cv-entry {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  column-gap: 18px;
  margin-bottom: 5px;
}
.cv-entry.no-year { grid-template-columns: 1fr; }
.cv-year { white-space: nowrap; }
.press-year {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  column-gap: 18px;
  margin-bottom: 14px;
}
.press-items > div { margin-bottom: 5px; }
.contact-row {
  display: flex;
  align-items: center;
  gap: 18px;
}
.contact-row a:hover { text-decoration: underline; text-underline-offset: 2px; }
.ig {
  width: 17px;
  height: 17px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ig svg { width: 17px; height: 17px; display: block; }

@media (max-width: 760px) {
  .cv-entry, .press-year {
    grid-template-columns: 46px minmax(0, 1fr);
    column-gap: 12px;
  }
}

/* chapter-style work navigation */
.years { white-space: nowrap; }
.years a { display: block; }




/* inner pages use the exact same .site / .sidebar / .topbar / .main shell */
.main.inner-page{
  align-items:flex-start;
  justify-content:flex-start;
  padding-top:72px;
}
.inner-content{
  width:min(760px, 100%);
  font-size:12px;
  letter-spacing:.03em;
  line-height:1.5;
}
.inner-content h1,
.inner-content h2{
  font:inherit;
  font-weight:400;
  margin:0;
}
.inner-content h1{
  margin-bottom:36px;
}
.cv-section{
  margin-bottom:34px;
}
.cv-section h2{
  margin-bottom:12px;
}
.cv-entry{
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  column-gap:18px;
  margin-bottom:5px;
}
.cv-entry.no-year{
  grid-template-columns:1fr;
}
.cv-year{
  white-space:nowrap;
}
.press-year{
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  column-gap:18px;
  margin-bottom:14px;
}
.press-items > div{
  margin-bottom:5px;
}
.contact-row{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
}
.contact-row a:hover{
  text-decoration:underline;
  text-underline-offset:2px;
}
.ig{
  width:17px;
  height:17px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.ig svg{
  width:17px;
  height:17px;
  display:block;
}
@media (max-width:720px){
  .main.inner-page{
    padding:24px 16px 36px;
  }
  .cv-entry,
  .press-year{
    grid-template-columns:46px minmax(0,1fr);
    column-gap:12px;
  }
}


/* sister */
.sister-main{
  padding-top:32px;
  padding-bottom:36px;
  display:block;
}
.sister-header{
  margin-bottom:18px;
  font-size:12px;
  letter-spacing:.03em;
  line-height:1.5;
}
.sister-title{
  margin:0;
  font:inherit;
  font-weight:400;
}
.sister-meta{
  margin-top:2px;
}
.sister-viewer{
  width:100%;
  max-width:1180px;
}
.sister-image-link{
  display:block;
  width:fit-content;
  max-width:100%;
  cursor:e-resize;
}
.sister-image{
  display:block;
  max-width:100%;
  width:auto;
  height:auto;
  max-height:86vh;
  object-fit:contain;
  object-position:left top;
}
.sister-caption{
  margin-top:10px;
  font-size:12px;
  letter-spacing:.03em;
  line-height:1.45;
}
.sister-pair{
  margin-top:5px;
  font-size:11px;
  letter-spacing:.03em;
}
.sister-pair .inactive{
  opacity:.42;
}
.sister-count{
  margin-top:4px;
  font-size:11px;
  opacity:.58;
}
@media (max-width:720px){
  .sister-main{
    padding:24px 16px 36px;
  }
  .sister-image{
    max-height:none;
    width:100%;
  }
}


/* sister detail viewer */
.sister-caption-row{
  margin-top:10px;
  display:flex;
  align-items:baseline;
  gap:16px;
  font-size:12px;
  letter-spacing:.03em;
  line-height:1.45;
}
.sister-caption{
  margin-top:0;
}
.sister-detail-toggle{
  border:0;
  background:transparent;
  padding:0;
  color:inherit;
  font:inherit;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:2px;
}
.sister-detail-meta{
  margin-top:5px;
  font-size:11px;
  letter-spacing:.03em;
  opacity:.58;
}
.sister-viewer.detail-mode .sister-image-link{
  cursor:e-resize;
}


/* quieter chapter navigation */
.years{
  display:flex;
  flex-direction:column;
  gap:0;
  margin-top:0;
}
.years a{
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  column-gap:10px;
  align-items:baseline;
  margin:0 0 9px 0;
  line-height:1.25;
  text-decoration:none;
}
.years a:hover .chapter-label{
  text-decoration:underline;
  text-underline-offset:2px;
}
.year-label{
  font-size:10px;
  letter-spacing:.04em;
  opacity:.48;
}
.chapter-label{
  font-size:12px;
  letter-spacing:.03em;
}
@media (max-width:720px){
  .years a{
    grid-template-columns:40px minmax(0,1fr);
    margin-bottom:7px;
  }
}


/* sister exhibition information */
.sister-info{
  margin-top:5px;
  font-size:11px;
  letter-spacing:.03em;
  line-height:1.45;
  opacity:.62;
}
.sister-intro{
  max-width:520px;
  margin:14px 0 0;
  font-size:11px;
  letter-spacing:.03em;
  line-height:1.5;
}
.sister-collection{
  margin-top:4px;
  min-height:16px;
  font-size:10px;
  letter-spacing:.03em;
  opacity:.45;
}
.sister-archive{
  width:100%;
  max-width:1040px;
  margin-top:58px;
  padding-top:14px;
  border-top:1px solid rgba(0,0,0,.12);
  padding-bottom:20px;
  font-size:10px;
  letter-spacing:.03em;
  line-height:1.6;
}
.sister-archive-row{
  display:grid;
  grid-template-columns:92px minmax(0,1fr);
  column-gap:16px;
  margin-bottom:4px;
}
.sister-archive-label{
  opacity:.45;
}
.sister-archive a{
  color:inherit;
  text-decoration:none;
}
.sister-archive a:hover{
  text-decoration:underline;
  text-underline-offset:2px;
}
.sister-links{
  display:flex;
  flex-wrap:wrap;
  gap:0 14px;
}
@media(max-width:720px){
  .sister-archive-row{
    display:block;
    margin-bottom:10px;
  }
  .sister-archive-label{
    display:block;
    margin-bottom:2px;
  }
}


/* larger sister artwork presentation */
.sister-main{
  padding-right:24px;
}
.sister-viewer,
.sister-archive{
  max-width:1320px;
}
.sister-image{
  max-height:90vh;
  max-width:100%;
}
@media (min-width:1200px){
  .sister-image{
    max-height:92vh;
  }
}

.sister-collection a{
  color:inherit;
  text-decoration:none;
}
.sister-collection a:hover{
  text-decoration:underline;
  text-underline-offset:2px;
}

.sister-info a{
  color:inherit;
  text-decoration:none;
}
.sister-info a:hover{
  text-decoration:underline;
  text-underline-offset:2px;
}





/* consistent visual scale for Sister detail images */
.sister-viewer.detail-mode .sister-image-link{
  display:block;
  width:min(1100px, 100%);
  max-width:none;
  height:auto;
}
.sister-viewer.detail-mode .sister-image{
  display:block;
  width:100%;
  height:auto;
  max-width:none;
  max-height:none;
  object-fit:initial;
}
@media (max-width:720px){
  .sister-viewer.detail-mode .sister-image-link{
    width:100%;
  }
}


/* match detail-image scale to the full Sister artwork */
.sister-viewer.detail-mode .sister-image-link{
  width:min(860px, 100%);
}
.sister-viewer.detail-mode .sister-image{
  width:100%;
  height:auto;
}


/* V33: detail width is set dynamically to the exact rendered width
   of that work's full image before detail mode opens */
.sister-viewer.detail-mode .sister-image-link{
  max-width:100%;
}
.sister-viewer.detail-mode .sister-image{
  max-width:100%;
  height:auto;
}


/* larger overall Sister presentation */
.sister-viewer,
.sister-archive{
  max-width:1440px;
}
.sister-main{
  padding-right:12px;
}
.sister-image{
  max-height:94vh;
}
@media (min-width:1200px){
  .sister-image{
    max-height:95vh;
  }
}


/* i, sunflower — compact project information */
.sf-head.sf-head-compact{
  margin-bottom:74px;
}
.sf-head-compact h1{
  margin-bottom:6px;
}
.sf-info-nav{
  display:flex;
  gap:13px;
  align-items:center;
  font-size:10px;
  line-height:1;
}
.sf-info-nav button{
  border:0;
  padding:0;
  margin:0;
  background:transparent;
  color:inherit;
  font:inherit;
  cursor:pointer;
  opacity:.5;
}
.sf-info-nav button:hover{
  opacity:1;
  text-decoration:underline;
  text-underline-offset:2px;
}

.sf-info-overlay{
  position:fixed;
  inset:0;
  z-index:1400;
  display:none;
  align-items:flex-start;
  justify-content:flex-end;
  padding:18px 22px;
  background:rgba(255,255,255,.88);
}
.sf-info-overlay.open{
  display:flex;
}
.sf-info-panel{
  position:relative;
  width:min(390px, calc(100vw - 44px));
  margin-top:36px;
  padding:25px 30px 27px;
  background:#fff;
  border:1px solid rgba(0,0,0,.11);
  font-size:11px;
  line-height:1.58;
  letter-spacing:.02em;
}
.sf-info-panel h2{
  margin:0 0 20px;
  font:inherit;
  font-size:10px;
  font-weight:400;
  opacity:.5;
}
.sf-info-panel p{
  margin:0 0 15px;
}
.sf-info-panel p:last-child{
  margin-bottom:0;
}
.sf-info-panel a{
  color:inherit;
  text-decoration:none;
}
.sf-info-panel a:hover{
  text-decoration:underline;
  text-underline-offset:2px;
}
.sf-info-close{
  position:absolute;
  top:8px;
  right:11px;
  border:0;
  padding:0;
  background:transparent;
  color:inherit;
  font-size:20px;
  line-height:1;
  font-weight:300;
  cursor:pointer;
}

@media(max-width:820px){
  .sf-head.sf-head-compact{
    margin-bottom:50px;
  }
  .sf-info-overlay{
    padding:12px;
  }
  .sf-info-panel{
    width:100%;
    margin-top:25px;
    padding:24px 25px 26px;
  }
}
