/* L02 · 关系家族 RPG 场景：精简任务栏与可放大的图鉴。 */

body[data-lesson="L02"].prototype-scene-page .prototype-drawer-nav{
  gap:1px;
  padding:2px 7px 58px;
}

body[data-lesson="L02"].prototype-scene-page .prototype-drawer:not(.open) .prototype-drawer-nav button,
body[data-lesson="L02"].prototype-scene-page .prototype-drawer:not(.open) .prototype-drawer-nav a{
  grid-template-columns:1fr;
  grid-template-rows:22px auto;
  justify-items:center;
  min-height:58px;
  padding:5px 2px 4px;
  text-align:center;
}

body[data-lesson="L02"].prototype-scene-page .prototype-drawer:not(.open) .prototype-nav-icon{
  width:auto;
  font-size:8px;
  letter-spacing:.05em;
}

body[data-lesson="L02"].prototype-scene-page .prototype-drawer:not(.open) .prototype-nav-label{
  max-width:62px;
  padding:0;
  overflow:hidden;
  color:#655a50;
  font-size:8.5px;
  line-height:1.25;
  white-space:normal;
  text-align:center;
}

body[data-lesson="L02"].prototype-scene-page .prototype-drawer:not(.open) .prototype-nav-label small{
  display:none;
}

body[data-lesson="L02"].prototype-scene-page .prototype-drawer.open .prototype-nav-label{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:2px;
  padding:7px 12px;
  white-space:normal;
}

body[data-lesson="L02"].prototype-scene-page .prototype-drawer.open .prototype-nav-label small{
  display:block;
  color:#948573;
  font-size:8px;
  line-height:1.35;
}

body[data-lesson="L02"].prototype-scene-page .prototype-drawer-nav [data-prototype-action="atlas"]{
  box-shadow:inset 3px 0 #a88755;
}

body[data-lesson="L02"].prototype-scene-page .prototype-drawer-foot{
  padding:0 7px;
  color:#9a8875;
  font-size:7px;
  line-height:1.45;
  letter-spacing:.06em;
  text-align:center;
}

body[data-lesson="L02"] .prototype-info-shot[role="button"]{
  position:relative;
  cursor:zoom-in;
  transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}

/* 林默试玩的操作提示与四幕轨道：状态必须留在行动区里，
   不能只藏在底部对白。 */
body[data-lesson="L02"] .prototype-choice-list button.is-tutorial-guide:disabled{
  min-height:72px;
  padding-left:62px;
  border-left:4px solid #327184;
  background:#e5efef;
  color:#173e48;
  opacity:1;
}

body[data-lesson="L02"] .prototype-choice-list button.is-tutorial-guide:disabled::before{
  content:"玩法";
  left:13px;
  top:18px;
  display:grid;
  width:34px;
  height:25px;
  place-items:center;
  border:0;
  background:#173e48;
  color:#ecffff;
  font:700 9px/1 ui-monospace,Consolas,monospace;
}

body[data-lesson="L02"] .prototype-choice-list button.is-sequence-track:disabled{
  min-height:88px;
  padding:14px 15px 13px 72px;
  border:1px solid #b9863f;
  border-left:5px solid #e3ad55;
  background:#17313e;
  color:#fff3d9;
  opacity:1;
}

body[data-lesson="L02"] .prototype-choice-list button.is-sequence-track:disabled::before{
  content:"轨道";
  left:15px;
  top:20px;
  display:grid;
  width:39px;
  height:29px;
  place-items:center;
  border:1px solid #e3ad55;
  background:transparent;
  color:#ffd98f;
  font:700 9px/1 ui-monospace,Consolas,monospace;
}

body[data-lesson="L02"] .prototype-choice-list button.is-sequence-track b{
  color:#fff3d9;
  font-size:12px;
  line-height:1.55;
}

body[data-lesson="L02"] .prototype-choice-list button.is-sequence-track small{
  color:#b9d0d6;
  font-size:9px;
}

body[data-lesson="L02"] .prototype-choice-list button.is-sequence-error:disabled{
  min-height:76px;
  padding-left:62px;
  border-left:5px solid #b54c34;
  background:#f4ded6;
  color:#652719;
  opacity:1;
  animation:l02-sequence-alert .32s ease-out 1;
}

body[data-lesson="L02"] .prototype-choice-list button.is-sequence-error:disabled::before{
  content:"重排";
  left:13px;
  top:20px;
  display:grid;
  width:34px;
  height:25px;
  place-items:center;
  border:0;
  background:#8f3825;
  color:#fff;
  font:700 9px/1 ui-monospace,Consolas,monospace;
}

body[data-lesson="L02"] .prototype-choice-list button.is-sequence-error small{
  color:#7d3527;
  font-size:9px;
  line-height:1.45;
}

@keyframes l02-sequence-alert{
  0%{transform:translateX(0)}
  35%{transform:translateX(-5px)}
  70%{transform:translateX(4px)}
  100%{transform:translateX(0)}
}

body[data-lesson="L02"] .prototype-info-shot[role="button"]::after{
  content:"点击放大";
  position:absolute;
  top:7px;
  right:7px;
  padding:4px 7px;
  border:1px solid rgba(255,255,255,.34);
  background:rgba(22,27,29,.86);
  color:#fff;
  font:700 8px/1 var(--prototype-sans);
  letter-spacing:.08em;
  pointer-events:none;
}

body[data-lesson="L02"] .prototype-info-shot[role="button"] img{
  transition:transform .2s ease,filter .2s ease;
}

body[data-lesson="L02"] .prototype-info-shot[role="button"]:hover,
body[data-lesson="L02"] .prototype-info-shot[role="button"]:focus-visible{
  border-color:#8a572b;
  box-shadow:0 10px 26px rgba(72,54,35,.18);
  transform:translateY(-2px);
}

body[data-lesson="L02"] .prototype-info-shot[role="button"]:hover img,
body[data-lesson="L02"] .prototype-info-shot[role="button"]:focus-visible img{
  transform:scale(1.025);
  filter:contrast(1.025);
}

@media(max-width:760px){
  body[data-lesson="L02"].prototype-scene-page .prototype-drawer:not(.open) .prototype-drawer-nav button,
  body[data-lesson="L02"].prototype-scene-page .prototype-drawer:not(.open) .prototype-drawer-nav a{
    grid-template-columns:48px minmax(0,1fr);
    grid-template-rows:auto;
    justify-items:stretch;
    text-align:left;
  }
  body[data-lesson="L02"].prototype-scene-page .prototype-drawer:not(.open) .prototype-nav-label{
    max-width:none;
    padding:0 12px;
    font-size:11px;
    text-align:left;
  }
}

@media(prefers-reduced-motion:reduce){
  body[data-lesson="L02"] .prototype-info-shot[role="button"],
  body[data-lesson="L02"] .prototype-info-shot[role="button"] img{
    transition:none;
  }
  body[data-lesson="L02"] .prototype-choice-list button.is-sequence-error:disabled{animation:none}
}
