/* Side 001 editorial study styles */
/* Side 001 reference layout — working-content polish, 2026-10-07 */

.side-reference .matrix-wrap{
  border-color:var(--ink);
  box-shadow:0 12px 36px rgba(23,23,23,.035);
}
.side-reference .matrix th{
  top:57px;
}
.side-reference .matrix thead th{
  padding-top:14px;
  padding-bottom:14px;
  font-size:.7rem;
  letter-spacing:.04em;
  vertical-align:bottom;
}
.side-reference .matrix-head-kicker{
  display:block;
  margin-bottom:4px;
  color:var(--accent);
  font-size:.56rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.side-reference .matrix-question{
  position:sticky;
  left:0;
  z-index:1;
  min-width:285px;
  background:var(--paper);
  font-family:var(--serif);
}
.side-reference .matrix-question small{
  display:block;
  margin-bottom:5px;
  color:var(--accent);
  font-family:var(--sans);
  font-size:.58rem;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.side-reference .matrix-question span{
  display:block;
  max-width:260px;
  font-size:.92rem;
  line-height:1.34;
}
.side-reference .matrix tr.group-start>*{
  border-top:1px solid var(--ink);
}
.side-reference .matrix-answer-cell{
  padding:0;
  vertical-align:middle;
}
.side-reference .matrix-answer{
  width:100%;
  min-height:58px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:11px 12px;
  border:0;
  background:transparent;
  color:var(--muted);
  font:inherit;
  font-size:.72rem;
  cursor:pointer;
  text-align:left;
}
.side-reference .matrix-answer:hover,
.side-reference .matrix-answer:focus-visible{
  background:var(--soft);
  color:var(--ink);
  outline:none;
}
.side-reference .matrix-answer:focus-visible{
  box-shadow:inset 0 0 0 1px var(--accent);
}
.side-reference .matrix-answer .status-dot{
  margin:0;
  flex:0 0 auto;
}
.side-reference .card-topline{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-start;
}
.side-reference .card-count{
  flex:0 0 auto;
  color:var(--muted);
  font-size:.62rem;
  font-weight:700;
  letter-spacing:.08em;
}
.side-reference .study-card,
.side-reference .question-card{
  position:relative;
  cursor:pointer;
  transition:background .16s ease;
}
.side-reference .study-card:hover,
.side-reference .study-card:focus-visible,
.side-reference .question-card:hover,
.side-reference .question-card:focus-visible{
  background:var(--soft);
  outline:none;
}
.side-reference .study-card:focus-visible,
.side-reference .question-card:focus-visible{
  box-shadow:inset 0 0 0 1px var(--accent);
}
.side-reference .study-card .source-line{
  margin-top:20px;
  padding-top:13px;
  border-top:1px solid var(--line);
  line-height:1.45;
}
.side-reference .study-card .source-line span{
  display:block;
  margin-bottom:4px;
  color:var(--accent);
  font-size:.58rem;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.side-reference .card-action{
  display:flex;
  justify-content:space-between;
  gap:16px;
  margin-top:22px;
  padding-top:12px;
  border-top:1px solid var(--line);
  color:var(--ink);
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.side-reference #questionsGrid{
  display:grid;
  grid-template-columns:1fr;
  gap:38px;
  background:none;
  border:0;
}
.side-reference .question-group{
  min-width:0;
}
.side-reference .question-group-head{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:baseline;
  padding:0 0 12px;
  border-bottom:1px solid var(--ink);
}
.side-reference .question-group-head span{
  font-family:var(--serif);
  font-size:1.35rem;
}
.side-reference .question-group-head small{
  color:var(--muted);
  font-size:.65rem;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.side-reference .question-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:var(--line);
  border-left:1px solid var(--line);
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.side-reference .question-card{
  min-height:185px;
}
.side-reference .question-card h3{
  max-width:520px;
  font-size:1.45rem;
  line-height:1.18;
}
body.drawer-open{
  overflow:hidden;
}
.side-reference .drawer-panel{
  width:min(620px,100%);
  padding:34px clamp(26px,4vw,46px) 52px;
}
.side-reference .drawer-panel h2{
  margin-top:42px;
  line-height:1.02;
}
.side-reference .drawer-summary{
  max-width:500px;
  color:#45413a;
  font-family:var(--serif);
  font-size:1.05rem;
  line-height:1.55;
}
.side-reference .answer-section{
  padding:20px 0 2px;
  border-top:1px solid var(--line);
}
.side-reference .answer-section:first-of-type{
  margin-top:32px;
  border-top-color:var(--ink);
}
.side-reference .answer-section h3{
  margin:0 0 8px;
  color:var(--accent);
  font-family:var(--sans);
  font-size:.63rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.side-reference .answer-section p{
  margin:0;
  font-family:var(--serif);
  font-size:1.06rem;
  line-height:1.58;
}
.side-reference .answer-section.boundary p{
  color:var(--muted);
  font-family:var(--sans);
  font-size:.86rem;
  line-height:1.55;
}
.side-reference .drawer-index{
  display:grid;
  gap:26px;
  margin-top:34px;
}
.side-reference .drawer-group{
  display:grid;
  gap:1px;
}
.side-reference .drawer-group-title{
  margin:0 0 8px;
  color:var(--accent);
  font-family:var(--sans);
  font-size:.64rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.side-reference .drawer-answer-link{
  width:100%;
  display:grid;
  grid-template-columns:48px minmax(0,1fr);
  gap:5px 12px;
  padding:14px 0;
  border:0;
  border-top:1px solid var(--line);
  background:transparent;
  color:var(--ink);
  text-align:left;
  cursor:pointer;
}
.side-reference .drawer-answer-link>span{
  grid-row:1/3;
  color:var(--accent);
  font-size:.64rem;
  font-weight:700;
  letter-spacing:.08em;
}
.side-reference .drawer-answer-link>strong{
  font-family:var(--serif);
  font-size:1rem;
  font-weight:500;
  line-height:1.3;
}
.side-reference .drawer-answer-link>small{
  color:var(--muted);
  font-size:.75rem;
  line-height:1.45;
}
.side-reference .drawer-answer-link:hover>strong,
.side-reference .drawer-answer-link:focus-visible>strong{
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
}
.side-reference .drawer-answer-link:focus-visible{
  outline:1px solid var(--accent);
  outline-offset:4px;
}
.side-reference .compare-question{
  display:grid;
  grid-template-columns:minmax(0,.4fr) minmax(0,1.6fr);
  gap:24px;
  align-items:baseline;
  margin-bottom:14px;
}
.side-reference .compare-question small{
  color:var(--accent);
  font-size:.61rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.side-reference .compare-question h3{
  margin:0;
  font-size:1.5rem;
}
.side-reference .compare-cell{
  min-height:245px;
  display:flex;
  flex-direction:column;
}
.side-reference .compare-cell p{
  flex:1;
}
.side-reference .compare-more{
  width:max-content;
  margin:18px 0 0;
  padding:0 0 4px;
  border:0;
  border-bottom:1px solid var(--ink);
  background:transparent;
  color:var(--ink);
  font:inherit;
  font-size:.66rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  cursor:pointer;
}
.side-reference .compare-more:hover,
.side-reference .compare-more:focus-visible{
  color:var(--accent);
  border-color:var(--accent);
  outline:none;
}
.side-reference .compare-empty{
  padding:30px 0;
  color:var(--muted);
  font-family:var(--serif);
  font-style:italic;
}

@media(max-width:780px){
  .side-reference .matrix th{top:48px}
  .side-reference .question-grid{grid-template-columns:1fr}
  .side-reference .question-group-head{align-items:flex-start}
  .side-reference .compare-question{grid-template-columns:1fr;gap:5px}
  .side-reference .drawer-panel{padding:24px 24px 42px}
}



/* Side 001: restrained editorial cover and floating study entrances */
body.side-reference.side-frame-001 .philosophy-intro{
 display:grid!important;grid-template-columns:minmax(0,1fr)!important;
 grid-template-rows:auto!important;row-gap:0!important;
 align-items:start!important;min-height:0!important;
 padding:clamp(32px,4.5vw,62px) 0 clamp(24px,3vw,42px)!important;
}
.side-reference .philosophy-intro .intro-topline{
 display:flex;justify-content:space-between;align-items:baseline;gap:16px;
 margin:0 0 clamp(25px,3.5vw,48px)
}
.side-reference .philosophy-intro .intro-topline p{
 margin:0;color:var(--accent);font-size:.64rem;line-height:1.3;
 font-weight:700;letter-spacing:.16em;text-transform:uppercase
}
.side-reference .philosophy-intro .intro-topline p:last-child{
 color:var(--muted);font-weight:600
}
.side-reference .philosophy-intro .side-hero-label{
 margin:0;color:var(--accent);font-size:.62rem;font-weight:700;
 letter-spacing:.16em;line-height:1.3;text-transform:uppercase
}
.side-reference .philosophy-intro h1{
 margin:10px 0 0;max-width:100%;font-family:var(--serif);
 font-size:clamp(4.7rem,8.4vw,8.4rem);font-weight:500;
 letter-spacing:-.066em;line-height:.93;color:var(--ink)
}
.side-reference .philosophy-intro .intro-purpose{
 display:grid;grid-template-columns:120px minmax(0,850px);
 gap:clamp(18px,3.5vw,48px);align-items:baseline;
 margin-top:clamp(24px,3vw,40px)
}
.side-reference .philosophy-intro .intro-purpose>p:last-child{
 margin:0;color:#3e3a34;font-family:var(--serif);
 font-size:clamp(1.21rem,1.9vw,1.77rem);line-height:1.38;letter-spacing:-.018em
}
.side-reference .philosophy-intro .intro-structure{
 display:flex;align-items:baseline;gap:clamp(24px,4vw,58px);
 margin-top:clamp(26px,3.4vw,44px)
}
.side-reference .philosophy-intro .intro-measures{
 display:flex;align-items:baseline;flex-wrap:wrap;
 gap:9px clamp(25px,4vw,64px)
}
.side-reference .philosophy-intro .intro-measures span{
 display:inline-flex;align-items:baseline;gap:7px;white-space:nowrap;
 color:#605a52;font-size:.83rem;line-height:1.5
}
.side-reference .philosophy-intro .intro-measures strong{
 font-family:var(--serif);font-size:1.32rem;font-weight:500;
 letter-spacing:-.025em;color:var(--ink)
}
/* The navigation is a set of editorial objects, not tabs. */
body.side-reference.side-frame-001 .study-entrances{
 position:static!important;top:auto!important;z-index:auto!important;
 border:0!important;background:transparent!important;backdrop-filter:none!important;
 padding:clamp(13px,2vw,27px) 0 clamp(31px,5vw,66px)!important
}
.side-reference .study-entrances-heading{
 display:flex;justify-content:space-between;align-items:baseline;
 gap:24px;margin:0 0 clamp(18px,2.3vw,30px)
}
.side-reference .study-entrances-heading .side-hero-label{
 margin:0;color:var(--accent);font-size:.64rem;font-weight:700;
 text-transform:uppercase;letter-spacing:.15em
}
.side-reference .study-entrances-heading p:last-child{
 margin:0;color:#756e64;font-size:.8rem;line-height:1.5
}
body.side-reference.side-frame-001 .study-entrances .study-nav-items{
 display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));
 gap:clamp(13px,1.8vw,23px);overflow:visible!important;min-width:0
}
body.side-reference.side-frame-001 .study-entrances .study-entry{
 display:flex;flex-direction:column;align-items:flex-start;
 width:100%;min-width:0;min-height:190px;gap:0;
 padding:clamp(24px,2.9vw,37px)!important;
 border:0!important;border-radius:12px;
 text-align:left;text-transform:none!important;letter-spacing:normal!important;
 color:var(--ink);white-space:normal;
 background:#f6f3ed;
 box-shadow:0 7px 29px rgba(36,31,24,.033),0 1px 4px rgba(36,31,24,.018);
 text-decoration:none;cursor:pointer;
 transition:background .18s ease,box-shadow .18s ease,transform .18s ease
}
body.side-reference.side-frame-001 .study-entrances .study-entry:nth-child(3){background:#f0ece4}
body.side-reference.side-frame-001 .study-entrances .study-entry:nth-child(4){background:#f3f0e9}
body.side-reference.side-frame-001 .study-entrances .study-entry:nth-child(5){background:#eeebe5}
body.side-reference.side-frame-001 .study-entrances .study-entry-primary{
 grid-column:1/-1;min-height:192px;
 display:grid;grid-template-columns:minmax(0,1.15fr) minmax(220px,.85fr);
 grid-template-areas:"label label" "heading detail" "heading arrow";
 align-items:start;column-gap:clamp(28px,5vw,78px);
 background:#e7e2d9
}
body.side-reference.side-frame-001 .study-entrances .study-entry small{
 display:block;color:var(--accent);
 font-family:var(--sans);font-size:.63rem!important;font-weight:700;
 letter-spacing:.12em;line-height:1.35;text-transform:uppercase
}
body.side-reference.side-frame-001 .study-entrances .study-entry strong{
 display:block;max-width:100%;margin:18px 0 0;
 font-family:var(--serif);font-size:clamp(1.7rem,2.8vw,2.55rem);
 font-weight:500;line-height:1.06;letter-spacing:-.04em;color:var(--ink)
}
body.side-reference.side-frame-001 .study-entrances .study-entry>span{
 display:block;max-width:450px;margin:12px 0 0;
 color:#615b53;font-family:var(--sans);font-size:.84rem;
 font-weight:400;letter-spacing:normal;line-height:1.55;
 white-space:normal!important;overflow:visible!important;text-overflow:clip!important
}
body.side-reference.side-frame-001 .study-entrances .study-entry em{
 display:block;align-self:flex-end;margin-top:auto;padding-top:18px;
 font-family:var(--serif);font-style:normal;font-size:1.5rem;
 font-weight:400;line-height:1;color:#71685d
}
body.side-reference.side-frame-001 .study-entrances .study-entry-primary small{grid-area:label}
body.side-reference.side-frame-001 .study-entrances .study-entry-primary strong{
 grid-area:heading;margin-top:19px;font-size:clamp(2.5rem,4.2vw,4.15rem)
}
body.side-reference.side-frame-001 .study-entrances .study-entry-primary>span{
 grid-area:detail;align-self:end;margin-top:19px;max-width:310px
}
body.side-reference.side-frame-001 .study-entrances .study-entry-primary em{
 grid-area:arrow;justify-self:end;align-self:end
}
body.side-reference.side-frame-001 .study-entrances .study-entry:hover{
 transform:translateY(-2px);background:#ece7de;
 box-shadow:0 13px 35px rgba(36,31,24,.072),0 2px 6px rgba(36,31,24,.02)
}
body.side-reference.side-frame-001 .study-entrances .study-entry:focus-visible{
 outline:2px solid var(--accent);outline-offset:3px
}
body.side-reference.side-frame-001 .study-entrances .study-entry.active{border:0!important}
body.side-reference.side-frame-001 .panel{
 padding-top:clamp(28px,4vw,51px)!important;scroll-margin-top:22px
}
body.side-reference.side-frame-001 .panel-intro{
 grid-template-columns:minmax(220px,.85fr) minmax(0,1.15fr)!important;
 gap:clamp(24px,4.5vw,67px)!important;margin-bottom:clamp(25px,3vw,42px)!important
}
body.side-reference.side-frame-001 .panel-intro h2{
 font-size:clamp(2.4rem,3.7vw,3.65rem)!important;
 letter-spacing:-.04em!important;line-height:1.05!important
}
.side-reference .panel-intro p{max-width:630px;color:#60594f;line-height:1.7}
.side-reference .matrix-wrap{
 border:1px solid rgba(66,56,44,.11);border-radius:5px;
 background:#faf8f4;box-shadow:0 11px 38px rgba(36,31,24,.038)
}
.side-reference .matrix th{top:0}
@media(max-width:980px){
 .side-reference .philosophy-intro h1{font-size:clamp(4.6rem,10vw,7.2rem)}
}
@media(max-width:700px){
 body.side-reference.side-frame-001 .philosophy-intro{padding:31px 0 24px!important}
 .side-reference .philosophy-intro .intro-topline{margin-bottom:25px}
 .side-reference .philosophy-intro h1{font-size:clamp(3.8rem,15vw,6rem)}
 .side-reference .philosophy-intro .intro-purpose{display:block;margin-top:27px}
 .side-reference .philosophy-intro .intro-purpose>p:last-child{
  margin-top:10px;font-size:1.25rem;line-height:1.4
 }
 .side-reference .philosophy-intro .intro-structure{display:block;margin-top:25px}
 .side-reference .philosophy-intro .intro-measures{margin-top:11px;gap:8px 22px}
 .side-reference .philosophy-intro .intro-measures strong{font-size:1.23rem}
 .side-reference .study-entrances-heading{display:block}
 .side-reference .study-entrances-heading p:last-child{margin-top:7px}
 body.side-reference.side-frame-001 .study-entrances .study-nav-items{
  grid-template-columns:1fr;gap:13px;padding:0!important
 }
 body.side-reference.side-frame-001 .study-entrances .study-entry{min-height:0;padding:23px!important}
 body.side-reference.side-frame-001 .study-entrances .study-entry-primary{
  grid-column:auto;display:flex;flex-direction:column;min-height:0
 }
 body.side-reference.side-frame-001 .study-entrances .study-entry-primary strong{font-size:2.65rem}
 body.side-reference.side-frame-001 .study-entrances .study-entry em{padding-top:11px}
 body.side-reference.side-frame-001 .panel-intro{
  grid-template-columns:1fr!important;gap:14px!important
 }
}
@media(prefers-reduced-motion:reduce){
 body.side-reference.side-frame-001 .study-entrances .study-entry{transition:none}
 body.side-reference.side-frame-001 .study-entrances .study-entry:hover{transform:none}
}
