/* Creator dictionary: a short invitation that opens into one focused comparison. */
.identity-mark{display:grid;place-items:center;flex:none;background:radial-gradient(circle at 35% 25%,#2b4b31,#102219 68%);border:1px solid rgba(214,255,66,.74);box-shadow:inset 0 0 0 3px #102219,0 0 0 1px rgba(246,242,233,.17);overflow:visible}
.identity-mark>span{color:#f6f2e9;font:italic 600 27px/.85 'Cormorant Garamond',Georgia,serif;letter-spacing:-.19em;transform:translateX(-2px)}
.identity-mark-join{color:var(--acid)}

.learning-shell{background:#0d1e13;color:var(--cream);border-top:1px solid var(--brand-rule);padding:clamp(60px,6vw,92px) clamp(20px,6vw,100px) clamp(58px,6vw,85px)}
.learning-inner{max-width:1600px;margin:auto}
.learning-head{display:flex;justify-content:space-between;align-items:end;gap:45px;margin-bottom:35px}
.learning-head .eyebrow{color:var(--acid);margin-bottom:13px}
.learning-head h1{font-family:var(--brand-display);font-size:clamp(48px,6vw,90px);font-weight:800;letter-spacing:-.09em;line-height:.95;margin:0}
.learning-head h1 em{font-family:var(--brand-serif);font-weight:500;letter-spacing:-.07em;color:var(--acid)}
.learning-head>p{max-width:420px;margin:0 0 4px;color:#c8d8c4;font-size:15px;line-height:1.65}
.learning-disclosure{border:1px solid rgba(226,241,215,.26);background:#102219}
.learning-disclosure>summary{min-height:152px;display:flex;justify-content:space-between;align-items:end;gap:20px;list-style:none;cursor:pointer;padding:29px 34px;background:linear-gradient(90deg,rgba(6,22,13,.96),rgba(6,22,13,.66) 57%,rgba(6,22,13,.07)),url('assets/camera-angles/eye-level.webp') center 49%/cover no-repeat;color:var(--cream);font-size:15px;font-weight:800;letter-spacing:.12em}
.learning-disclosure>summary::-webkit-details-marker{display:none}
.learning-disclosure>summary small{display:block;margin-top:8px;color:#d0ddc6;font-size:12px;font-weight:500;letter-spacing:0}
.learning-open-icon{display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(246,242,233,.76);border-radius:50%;font-size:22px;font-weight:400;letter-spacing:0;transition:transform .2s ease}
.learning-disclosure[open] .learning-open-icon{transform:rotate(135deg)}
.learning-body{padding:clamp(18px,3vw,42px)}
.learning-layout{display:grid;grid-template-columns:minmax(235px,.33fr) minmax(0,1fr);gap:clamp(24px,3vw,48px)}
.learning-side{min-width:0}
.learning-reference{border:1px solid rgba(246,242,233,.22);background:#172e1e}
.learning-reference img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.learning-reference>div{padding:15px 17px 17px}
.learning-reference span,.angle-prompt span{color:var(--acid);font-size:10px;font-weight:800;letter-spacing:.16em}
.learning-reference p{font-size:12px;line-height:1.55;color:#d5e0d0;margin:7px 0 0}
.learning-instruction{margin:20px 0 12px;color:#c5d3bf;font-size:12px;line-height:1.55}
.angle-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.angle-choices button{min-height:43px;display:flex;gap:10px;align-items:center;text-align:left;padding:8px 10px;border:1px solid rgba(246,242,233,.18);background:#14291b;color:#f1f4e9;font-size:11px;font-weight:700;line-height:1.25;transition:background .18s ease,color .18s ease}
.angle-choices button span{color:#aabb9f;font:700 9px 'DM Sans',Arial,sans-serif}
.angle-choices button:hover{background:#23442b}
.angle-choices button[aria-pressed="true"]{background:var(--acid);color:var(--ink);border-color:var(--acid)}
.angle-choices button[aria-pressed="true"] span{color:#436134}
.learning-main{min-width:0}
.angle-image-wrap{position:relative;background:#0b170f;border:1px solid rgba(246,242,233,.27);overflow:hidden}
.angle-image-wrap img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.angle-image-index{position:absolute;right:16px;bottom:15px;padding:8px 10px;background:rgba(9,23,14,.82);color:var(--cream);font-size:10px;font-weight:800;letter-spacing:.12em}
.angle-caption{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,.46fr);gap:28px;border-top:2px solid var(--acid);padding:22px 0 0}
.angle-caption .eyebrow{color:var(--acid);font-size:9px;margin:0 0 12px}
.angle-caption h2{font-family:var(--brand-display);font-size:clamp(28px,3vw,42px);font-weight:800;letter-spacing:-.07em;line-height:1.05;margin:0 0 10px}
.angle-caption p{color:#d5e2cf;font-size:14px;line-height:1.6;margin:0}
.angle-prompt{border-left:1px solid var(--brand-rule);padding-left:26px;align-self:start}
.angle-prompt p{margin-top:10px;font-size:12px}
.learning-foot{margin:27px 0 0;padding-top:16px;border-top:1px solid var(--brand-rule);color:#aabda6;font-size:11px;line-height:1.6}
.learning-foot a{color:#e4f6d1;text-underline-offset:3px}

@media(max-width:1000px){.learning-layout{grid-template-columns:230px minmax(0,1fr)}.angle-choices{grid-template-columns:1fr}.angle-caption{grid-template-columns:1fr}.angle-prompt{border-left:0;border-top:1px solid var(--brand-rule);padding:16px 0 0}}
@media(max-width:720px){
  .identity-mark>span{font-size:23px}
  .top-links a:nth-child(2),.top-links a:nth-child(3){display:none}
  .learning-shell{padding:58px 18px 65px}
  .learning-head{display:block;margin-bottom:25px}
  .learning-head h1{font-size:clamp(48px,11vw,68px)}
  .learning-head>p{font-size:13px;margin-top:16px}
  .learning-disclosure>summary{min-height:128px;padding:20px;background-position:58% 50%;font-size:12px}
  .learning-disclosure>summary small{font-size:10px}
  .learning-body{padding:15px}
  .learning-layout{display:block}
  .learning-reference{display:grid;grid-template-columns:38% 1fr;align-items:center}
  .learning-reference img{height:100%;min-height:115px;object-fit:cover}
  .learning-reference>div{padding:10px 13px}
  .learning-reference span{font-size:8px}
  .learning-reference p{font-size:10px;margin-top:5px}
  .learning-instruction{margin:15px 0 9px;font-size:11px}
  .angle-choices{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity;padding-bottom:8px;margin-bottom:15px}
  .angle-choices::-webkit-scrollbar{display:none}
  .angle-choices button{flex:none;min-height:39px;padding:6px 10px;font-size:10px;scroll-snap-align:start}
  .angle-caption{padding-top:17px;gap:14px}
  .angle-caption h2{font-size:30px}
  .angle-caption p{font-size:12px}
  .angle-prompt p{font-size:11px}
  .learning-foot{font-size:10px}
}
