@font-face{font-family:Inter;font-style:normal;font-weight:400;font-display:swap;src:url(fonts/Inter-Regular.woff2) format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:600;font-display:swap;src:url(fonts/Inter-SemiBold.woff2) format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:700;font-display:swap;src:url(fonts/Inter-Bold.woff2) format("woff2")}

/* Readable bilingual typography + touch targets */
:root{
  --body-size:17px;
  --body-lh:1.9;
  --panel-max:38rem;
}
@media (max-width:760px){:root{--body-size:16px}}
body.lang-en{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --body-lh:1.65;
}
body.lang-en .lbl,body.lang-en .panel,body.lang-en .top,body.lang-en .hintbar,body.lang-en .credit{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
body.lang-en .back-arrow,body.lang-en .pback .back-arrow{transform:none}
.lang{
  appearance:none;border:1px solid rgba(40,20,10,.14);background:rgba(255,255,255,.72);
  backdrop-filter:blur(8px);border-radius:999px;padding:.45rem .7rem;font:600 .85rem/1 Inter,system-ui,sans-serif;
  color:#3a2418;cursor:pointer;min-width:2.6rem;min-height:2.4rem;
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 6px 18px rgba(80,30,10,.08);
}
.lang:active{transform:scale(.96)}
.top{padding-top:max(.55rem,env(safe-area-inset-top));gap:.45rem;flex-wrap:wrap}
.back,.pback{min-height:2.5rem;padding:.45rem .85rem}
.hintbar{padding-bottom:max(.55rem,env(safe-area-inset-bottom));padding-inline:max(.75rem,env(safe-area-inset-left)) max(.75rem,env(safe-area-inset-right))}
.credit{padding-bottom:max(.35rem,env(safe-area-inset-bottom))}
.panel{padding-bottom:max(1rem,env(safe-area-inset-bottom));max-width:min(560px,var(--panel-max))}
.pbody,.panel p,.panel li,.keys p{
  font-size:var(--body-size)!important;
  line-height:var(--body-lh)!important;
  color:#2a1a12;
}
.panel h2{line-height:1.35;font-size:clamp(1.25rem,2.4vw,1.65rem);color:#1f120c}
.panel h3{line-height:1.4;font-size:1.05rem;color:#3a2418;margin-top:1.15em}
.panel .en{opacity:.78;font-size:.95em;line-height:1.5}
.lbl{padding:.42rem .62rem;min-height:2.1rem;border-radius:14px}
.lbl .hint{margin-top:.2rem;font-size:.78rem;opacity:.85;font-weight:600}
.lbl.center{padding:.65rem .9rem;min-width:0}
@media (pointer:coarse){
  .lbl.ka,.lbl.topic,.lbl.found{padding:5px 10px 5px 4px;min-height:0}
  .lbl.center{padding:.8rem 1rem}
  .chip{min-height:2.55rem;padding:.55rem .9rem;font-size:1rem}
}
body.lang-en .crumbs .sep{transform:none}
body.lang-en .pn{flex-direction:row}
.labels{pointer-events:none!important}
.labels .lbl{pointer-events:auto}

@font-face{font-family:Vazirmatn;src:url(fonts/Vazirmatn-Light.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:Vazirmatn;src:url(fonts/Vazirmatn-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Vazirmatn;src:url(fonts/Vazirmatn-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:Vazirmatn;src:url(fonts/Vazirmatn-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Vazirmatn;src:url(fonts/Vazirmatn-ExtraBold.woff2) format("woff2");font-weight:800;font-display:swap}
:root{--ink:#2d2233;--ink2:#5f4f66;--line:rgba(60,30,60,.12);--card:rgba(255,255,255,.78)}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;font-family:Vazirmatn,Tahoma,sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
button{font-family:inherit;color:inherit;cursor:pointer}
.bg{position:fixed;inset:0;background:linear-gradient(150deg,#ffe2d4 0%,#fcd9df 38%,#ecdcf5 72%,#e2f1e4 100%);overflow:hidden}
.bg span{position:absolute;border-radius:50%;filter:blur(70px);opacity:.75}
.bg .b1{width:46vw;height:46vw;right:-10vw;top:-14vw;background:#ffc9b2}
.bg .b2{width:40vw;height:40vw;left:-12vw;bottom:-14vw;background:#d6efd9}
.bg .b3{width:30vw;height:30vw;left:30vw;top:-10vw;background:#ead2f2}
#stage{position:fixed;inset:0}
#stage canvas{display:block;touch-action:manipulation}
.labels{position:absolute;inset:0;pointer-events:none;direction:ltr}
.labels>div{left:0;top:0}
.lbl{direction:rtl;pointer-events:auto;cursor:pointer;user-select:none;white-space:nowrap}
.lbl.ka,.lbl.topic,.lbl.found,.lbl.glass{display:flex;align-items:center;gap:6px;padding:4px 10px 4px 4px;background:rgba(255,255,255,.48);border:1px solid rgba(255,255,255,.72);border-radius:999px;box-shadow:0 6px 16px -8px rgba(90,40,70,.28),0 1px 0 rgba(255,255,255,.85) inset;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:transform .2s,box-shadow .2s,opacity .25s;margin-top:0;white-space:normal}
.lbl .num{display:inline-grid;place-items:center;min-width:22px;height:22px;border-radius:50%;color:#fff;font-weight:800;font-size:12px;box-shadow:0 2px 6px -2px rgba(0,0,0,.28);flex:0 0 auto}
.lbl .num.big{min-width:34px;height:34px;font-size:17px;margin-bottom:4px}
.lbl .tx{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.lbl .tx b{font-weight:700;font-size:12.5px;max-width:9.5rem;white-space:normal;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.lbl .tx i{font-style:normal;font-size:9.5px;color:var(--ink2);direction:ltr;text-align:right;letter-spacing:.2px}
.lbl.topic .tx b{font-size:12px;max-width:10rem}
.lbl.found .tx b{font-size:11.5px;font-weight:600;max-width:6.5rem}
.lbl.hover{transform:translateY(-3px) scale(1.05);box-shadow:0 10px 22px -10px rgba(90,40,70,.42),0 0 0 1px rgba(255,255,255,.9) inset}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .lbl.ka,.lbl.topic,.lbl.found,.lbl.glass{background:rgba(255,255,255,.88)}
}
.lbl.center{display:flex;flex-direction:column;align-items:center;text-align:center;padding:10px 18px 9px;background:rgba(255,255,255,.92);border-radius:18px;box-shadow:0 14px 34px -14px rgba(90,40,70,.45);margin-top:0}
.lbl.center .ttl{font-weight:800;font-size:20px;letter-spacing:-.2px}
.lbl.center .en{font-size:11.5px;color:var(--ink2);direction:ltr}
.lbl.center .hint{margin-top:5px;font-size:10.5px;color:#a2546f;background:#fdebef;border-radius:999px;padding:1px 9px}
.lbl.found{/* glass shared with .ka/.topic */;font-size:11.5px}
.lbl.found b{font-weight:600}
.lbl.tag{pointer-events:none;font-size:11px;color:var(--ink2);letter-spacing:.3px;background:rgba(255,255,255,.5);padding:2px 10px;border-radius:999px}
/* header */
.top{position:fixed;top:0;right:0;left:0;display:flex;align-items:center;gap:14px;padding:14px 18px;z-index:5;pointer-events:none}
.top>*{pointer-events:auto}
.brand{display:flex;align-items:center;gap:10px;background:var(--card);border:0;border-radius:16px;padding:7px 14px 7px 12px;box-shadow:0 8px 24px -14px rgba(90,40,70,.5);backdrop-filter:blur(10px);text-align:right}
.brand b{display:block;font-weight:800;font-size:14.5px}
.brand small{display:block;font-size:11px;color:var(--ink2)}
.logo{position:relative;width:30px;height:30px}
.logo i{position:absolute;border-radius:50%}
.logo i:nth-child(1){inset:8px;background:#f27a5e}
.logo i:nth-child(2){inset:2px;border:2.5px solid #e7ad3f;transform:scaleY(.45) rotate(-20deg)}
.logo i:nth-child(3){width:7px;height:7px;background:#9c4f96;top:3px;left:2px}
.crumbs{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px;background:rgba(255,255,255,.55);border-radius:999px;padding:5px 12px;backdrop-filter:blur(8px)}
.crumbs button{border:0;background:none;padding:2px 4px;font-weight:600;border-radius:6px}
.crumbs button:hover{background:rgba(255,255,255,.8)}
.crumbs button[style]{color:var(--c)}
.crumbs span{color:var(--ink2)}
.crumbs .sep{font-style:normal;color:#b99aa8}
.back{margin-inline-start:auto;border:0;background:#2d2233;color:#fff;border-radius:999px;padding:8px 16px;font-weight:700;font-size:13.5px;box-shadow:0 8px 20px -10px rgba(45,34,51,.7);transition:opacity .25s,transform .25s}
.back.off{opacity:0;pointer-events:none;transform:translateY(-6px)}
/* panel */
.panel{position:fixed;z-index:6;top:78px;right:18px;bottom:18px;width:min(560px,42vw);background:rgba(255,255,255,.9);backdrop-filter:blur(16px);border-radius:24px;box-shadow:0 30px 70px -30px rgba(90,40,70,.55),0 0 0 1px rgba(255,255,255,.9) inset;display:flex;flex-direction:column;visibility:hidden;opacity:0;transform:translateX(110%);overflow:hidden}
.pbar{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line)}
.pback{border:0;background:color-mix(in srgb,var(--c) 14%,#fff);color:color-mix(in srgb,var(--c) 70%,#2d2233);border-radius:999px;padding:6px 14px;font-weight:700;font-size:13px}
.pbar kbd{margin-inline-start:auto;font-family:inherit;font-size:11px;color:var(--ink2);border:1px solid var(--line);border-radius:6px;padding:1px 6px}
.grab{display:none}
.pbody{overflow-y:auto;overscroll-behavior:contain;padding:0 0 30px;scrollbar-width:thin}
.ph{padding:22px 26px 18px;background:linear-gradient(160deg,color-mix(in srgb,var(--c) 20%,#fff),#fff 85%);border-bottom:1px solid var(--line)}
.ph .kicker{display:inline-block;font-size:12px;font-weight:700;color:#fff;background:var(--c);border-radius:999px;padding:2px 11px}
.ph h2{margin:10px 0 2px;font-size:26px;font-weight:800;line-height:1.35}
.ph .en{direction:ltr;text-align:right;font-size:13px;color:var(--ink2);letter-spacing:.2px}
.pc{padding:6px 26px}
.pc section{margin-top:20px}
.pc h3{display:flex;align-items:center;gap:8px;margin:0 0 8px;font-size:16.5px;font-weight:800}
.pc h3 .ic{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:8px;background:color-mix(in srgb,var(--c) 16%,#fff);color:var(--c);font-size:13px}
.pc p{margin:0;font-size:15px;line-height:2;text-align:justify;color:#3b2f42}
.kt{font-weight:700;color:color-mix(in srgb,var(--c) 75%,#2d2233);background:linear-gradient(transparent 62%,color-mix(in srgb,var(--c) 18%,transparent) 0)}
.keys{list-style:none;margin:0;padding:0;counter-reset:k;display:grid;gap:9px}
.keys li{counter-increment:k;position:relative;padding:11px 14px 11px 12px;padding-inline-start:44px;background:#fff;border:1px solid var(--line);border-radius:14px}
.keys li::before{content:counter(k,persian);position:absolute;right:12px;top:12px;width:22px;height:22px;border-radius:7px;background:var(--c);color:#fff;font-size:12px;font-weight:800;display:grid;place-items:center}
.keys .kh{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;margin-bottom:3px}
.keys .kh b{font-size:14.5px;font-weight:800}
.keys .kh .en{direction:ltr;font-size:11.5px;color:var(--ink2);background:#f6eff4;border-radius:6px;padding:0 6px}
.keys p{font-size:14px;line-height:1.95}
.ex{background:color-mix(in srgb,var(--c) 9%,#fff);border:1px dashed color-mix(in srgb,var(--c) 45%,#fff);border-radius:16px;padding:14px 16px}
.ex h3::after{content:"مثال فرضی";font-size:10.5px;font-weight:600;color:var(--ink2);background:#fff;border-radius:999px;padding:1px 8px;margin-inline-start:auto}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{display:inline-flex;align-items:center;gap:7px;border:1px solid color-mix(in srgb,var(--c) 35%,#fff);background:color-mix(in srgb,var(--c) 8%,#fff);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600;transition:transform .15s,background .15s}
.chip:hover{transform:translateY(-2px);background:color-mix(in srgb,var(--c) 18%,#fff)}
.chip .dot{width:8px;height:8px;border-radius:50%;background:var(--c)}
.pn{display:flex;justify-content:space-between;gap:10px;margin-top:26px;padding-top:16px;border-top:1px solid var(--line)}
.hintbar{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);font-size:12.5px;color:var(--ink2);background:rgba(255,255,255,.6);padding:6px 16px;border-radius:999px;backdrop-filter:blur(8px);white-space:nowrap;z-index:2;transition:opacity .3s}
body.panel-open .hintbar{opacity:0}
.credit{position:fixed;left:18px;bottom:18px;z-index:3;font-size:12px;font-weight:600;color:var(--ink);background:rgba(255,255,255,.66);border-radius:12px;padding:6px 12px;backdrop-filter:blur(8px)}
.credit span{color:#d06a7c}
.dcur{position:fixed;z-index:20;display:none;width:26px;height:26px;margin:-4px 0 0 -4px;pointer-events:none;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l16 9-7 1.6L9.6 20z' fill='%232d2233' stroke='white' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E");transition:transform .12s}
.dcur::after{content:"";position:absolute;left:-12px;top:-12px;width:30px;height:30px;border-radius:50%;background:rgba(242,122,94,.35);transform:scale(0);transition:transform .2s}
.dcur.down::after{transform:scale(1)}
.dcur.down{transform:scale(.88)}
@media (max-width:760px),(max-aspect-ratio:4/5){
  .top{padding:10px;gap:8px;flex-wrap:wrap}
  .brand{padding:5px 10px}.brand b{font-size:13px}.brand small{display:none}.logo{width:24px;height:24px}
  .crumbs{order:3;width:100%;font-size:12px;padding:4px 10px}
  .back{padding:7px 13px;font-size:12.5px}
  .panel{top:auto;right:0;left:0;bottom:0;width:100%;height:76vh;height:76dvh;border-radius:24px 24px 0 0;transform:translateY(100%)}
  .grab{display:block;position:absolute;top:6px;left:50%;width:44px;height:4px;margin-left:-22px;border-radius:4px;background:#e3d3dc}
  .pbar{position:relative;padding-top:16px}.pbar kbd{display:none}
  .ph{padding:16px 18px 14px}.ph h2{font-size:21px}.pc{padding:4px 18px}
  .pc p{font-size:14.5px;line-height:1.95}
  .hintbar{bottom:48px;font-size:11px;white-space:normal;width:86%;text-align:center}
  .credit{left:50%;transform:translateX(-50%);bottom:10px;font-size:10.5px;white-space:nowrap}
  .lbl.ka,.lbl.topic,.lbl.found,.lbl.glass{gap:3px;padding:2px 7px 2px 2px;max-width:34vw;background:rgba(255,255,255,.78);box-shadow:0 4px 14px -6px rgba(90,40,70,.35),0 1px 0 rgba(255,255,255,.95) inset}
  .lbl .num{min-width:16px;height:16px;font-size:10px}
  .lbl .tx b{font-size:11.5px;max-width:5.0rem;line-height:1.22;overflow:visible;-webkit-line-clamp:2;color:#1f120c;text-shadow:0 1px 0 rgba(255,255,255,.8)}.lbl .tx i{display:none}
  .lbl.topic .tx b{font-size:11.5px;max-width:5.4rem}
  .lbl.found .tx b{font-size:11px;max-width:4.6rem}
  @supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
    .lbl.ka,.lbl.topic,.lbl.found,.lbl.glass{background:rgba(255,255,255,.86)}
  }
  /* Compact pill so the center 3D icon stays visible */
  .lbl.center{display:inline-flex!important;flex-direction:row!important;flex-wrap:nowrap!important;justify-content:center;align-items:center;gap:6px;padding:5px 10px!important;border-radius:999px!important;width:max-content!important;min-width:0!important;max-width:48vw!important}
  .lbl.center .num.big{min-width:20px;height:20px;font-size:11px;margin:0}
  .lbl.center .ttl{font-size:12px!important;font-weight:800;max-width:36vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .lbl.center .en,.lbl.center .hint{display:none!important}
}

/* ---- Caption bar + legend (glass node labels above) ---- */
.lbl.mob-hide{display:none!important}
.caption{
  position:fixed;left:50%;bottom:52px;transform:translateX(-50%) translateY(8px);
  z-index:4;display:flex;align-items:center;gap:8px;
  max-width:min(92vw,420px);padding:8px 14px 8px 8px;
  background:rgba(255,255,255,.92);border-radius:999px;
  box-shadow:0 10px 28px -12px rgba(90,40,70,.45),0 0 0 1px rgba(255,255,255,.9) inset;
  backdrop-filter:blur(10px);opacity:0;pointer-events:none;
  transition:opacity .2s,transform .2s;direction:inherit;
}
.caption.show{opacity:1;transform:translateX(-50%) translateY(0)}
.caption .cap-num{
  display:inline-grid;place-items:center;min-width:28px;height:28px;border-radius:50%;
  color:#fff;font-weight:800;font-size:13px;flex:0 0 auto;
}
.caption .cap-name{font-weight:700;font-size:14px;line-height:1.25;color:#2a1a12;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70vw}
.hintbar.gone{opacity:0!important;pointer-events:none}
.legend-btn{
  appearance:none;border:1px solid rgba(40,20,10,.14);background:rgba(255,255,255,.72);
  backdrop-filter:blur(8px);border-radius:999px;padding:.45rem .75rem;
  font:600 .85rem/1 Vazirmatn,Inter,system-ui,sans-serif;color:#3a2418;cursor:pointer;
  min-height:2.4rem;box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 6px 18px rgba(80,30,10,.08);
}
.legend-btn:active{transform:scale(.96)}
.legend-scrim{display:none;position:fixed;inset:0;background:rgba(40,20,30,.28);z-index:8;backdrop-filter:blur(2px)}
.legend-sheet{
  position:fixed;z-index:9;left:0;right:0;bottom:0;max-height:72dvh;
  background:rgba(255,255,255,.96);border-radius:22px 22px 0 0;
  box-shadow:0 -20px 50px -24px rgba(90,40,70,.5);
  transform:translateY(110%);transition:transform .35s cubic-bezier(.2,.8,.2,1);
  display:flex;flex-direction:column;padding-bottom:max(12px,env(safe-area-inset-bottom));
  visibility:hidden;
}
body.legend-open .legend-sheet{transform:translateY(0);visibility:visible}
body.legend-open .legend-scrim{display:block}
body.legend-open .hintbar,body.legend-open .caption{opacity:0!important}
.legend-head{display:flex;align-items:center;gap:10px;padding:14px 16px 10px;border-bottom:1px solid var(--line)}
.legend-head b{font-size:15px;font-weight:800}
.legend-close{margin-inline-start:auto;border:0;background:#f3e8ee;border-radius:999px;padding:7px 14px;font-weight:700;font-size:13px}
.legend-list{overflow-y:auto;overscroll-behavior:contain;padding:8px 10px 18px;display:grid;gap:6px}
.leg-item{
  display:flex;align-items:center;gap:10px;width:100%;border:1px solid rgba(60,30,60,.1);
  background:#fff;border-radius:14px;padding:10px 12px;text-align:inherit;cursor:pointer;
  font:inherit;color:inherit;
}
.leg-item:active{background:color-mix(in srgb,var(--c) 10%,#fff)}
.leg-item .num{display:inline-grid;place-items:center;min-width:28px;height:28px;border-radius:50%;color:#fff;font-weight:800;font-size:13px;flex:0 0 auto}
.leg-tx{display:flex;flex-direction:column;gap:1px;min-width:0}
.leg-tx b{font-weight:700;font-size:14px;line-height:1.3}
.leg-tx i{font-style:normal;font-size:11px;color:var(--ink2)}
body.lang-en .legend-btn,body.lang-en .legend-sheet,body.lang-en .caption{font-family:Inter,system-ui,sans-serif}
@media (min-width:761px) and (min-aspect-ratio:4/5){
  /* Desktop: legend as a side card is unnecessary; keep button but sheet centered-ish */
  .legend-sheet{left:auto;right:18px;bottom:18px;width:min(380px,36vw);max-height:78vh;border-radius:20px;transform:translateY(12px) scale(.98);opacity:0}
  body.legend-open .legend-sheet{transform:none;opacity:1}
  .caption{bottom:28px}
}
@media (max-width:760px),(max-aspect-ratio:4/5){
  .caption{bottom:40px}
  .credit{font-size:9.5px;padding:3px 9px;opacity:.8;bottom:8px}
  .hintbar{bottom:40px;font-size:10.5px;padding:4px 11px;width:82%}
  body.is-mobile .hintbar.gone{display:none}
  .legend-btn{padding:.4rem .7rem;font-size:.8rem;min-height:2.25rem}
  /* Hide redundant crumbs title duplication is fine; keep crumbs compact */
  .crumbs{font-size:11.5px}
}

/* Rooftop captions — glass sign sitting on the icon */
.lbl.rooftop{
  box-shadow:0 8px 18px -10px rgba(90,40,70,.42),0 2px 0 rgba(255,255,255,.9) inset,0 10px 14px -12px rgba(40,20,30,.35);
}
.lbl.rooftop::after{
  content:"";position:absolute;left:50%;bottom:-5px;width:10px;height:5px;margin-left:-5px;
  background:radial-gradient(ellipse at center, rgba(40,20,30,.22), transparent 70%);
  pointer-events:none;
}
.lbl.ka.rooftop,.lbl.topic.rooftop,.lbl.found.rooftop{position:relative}

/* ---- Glossary term links + glass sheet ---- */
button.gterm{
  appearance:none;border:0;margin:0;padding:1px 4px 2px;
  font:inherit;font-weight:650;
  color:#9a3d5c;
  background:rgba(196,90,122,.12);
  border-radius:5px;
  border-bottom:1.5px dashed #c45a7a;
  text-underline-offset:3px;
  box-decoration-break:clone;-webkit-box-decoration-break:clone;
  cursor:pointer;display:inline;line-height:inherit;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
  min-height:1.7em;vertical-align:baseline;
}
button.gterm:active{background:rgba(196,90,122,.26);color:#7a2d48}
.gloss-scrim{display:none;position:fixed;inset:0;background:rgba(40,20,30,.32);z-index:10;backdrop-filter:blur(3px)}
.gloss-sheet{
  position:fixed;z-index:11;left:0;right:0;bottom:0;max-height:78dvh;
  background:rgba(255,255,255,.97);border-radius:22px 22px 0 0;
  box-shadow:0 -22px 55px -22px rgba(90,40,70,.55);
  transform:translateY(110%);transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .25s;
  display:flex;flex-direction:column;padding-bottom:max(14px,env(safe-area-inset-bottom));
  visibility:hidden;opacity:1;
}
body.gloss-open .gloss-sheet{transform:translateY(0);visibility:visible}
body.gloss-open .gloss-scrim{display:block}
.gloss-head{display:flex;align-items:center;gap:10px;padding:14px 16px 10px;border-bottom:1px solid var(--line)}
.gloss-head b{font-size:16px;font-weight:800;flex:1;min-width:0;line-height:1.35}
.gloss-back{border:0;background:#f3e8ee;border-radius:999px;padding:7px 12px;font-weight:700;font-size:13px;cursor:pointer;flex:0 0 auto}
.gloss-close{margin-inline-start:auto;border:0;background:#f3e8ee;border-radius:999px;padding:7px 14px;font-weight:700;font-size:13px;cursor:pointer;flex:0 0 auto}
.gloss-body{overflow-y:auto;overscroll-behavior:contain;padding:14px 18px 22px;-webkit-overflow-scrolling:touch}
.gloss-body .gexp{font-size:15.5px;line-height:1.85;color:#3b2f42;margin:0 0 14px;text-align:justify}
body.lang-en .gloss-body .gexp{line-height:1.65;text-align:start}
.gloss-ex{
  background:linear-gradient(135deg,rgba(242,122,94,.12),rgba(231,173,63,.1));
  border:1px solid rgba(90,40,70,.1);border-radius:14px;padding:12px 14px;margin:0 0 14px;
}
.gloss-ex .glab{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.02em;
  color:#a2546f;background:#fff;border-radius:999px;padding:2px 10px;margin-bottom:8px}
.gloss-ex .gextext{font-size:15px;line-height:1.8;color:#3b2f42;margin:0}
.gloss-ex .gdiag{display:block;width:min(100%,220px);height:auto;margin:10px auto 4px}
.gloss-rel{margin-top:4px}
.gloss-rel h4{margin:0 0 8px;font-size:13px;font-weight:800;color:#5a3040}
.gloss-rel .chips{display:flex;flex-wrap:wrap;gap:8px}
.gloss-rel .gchip{
  appearance:none;border:1px solid rgba(60,30,60,.12);background:#fff;border-radius:999px;
  padding:8px 14px;font:700 13.5px/1.2 inherit;color:#3a2418;cursor:pointer;
  min-height:2.4rem;-webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.gloss-rel .gchip:active{background:#fdebef}
body.lang-en .gloss-sheet,body.lang-en .gloss-back,body.lang-en .gloss-close{font-family:Inter,system-ui,sans-serif}
@media (min-width:761px) and (min-aspect-ratio:4/5){
  .gloss-sheet{
    left:auto;right:18px;bottom:18px;top:78px;width:min(420px,38vw);max-height:none;height:auto;
    border-radius:20px;transform:translateY(12px) scale(.98);opacity:0;
  }
  body.gloss-open .gloss-sheet{transform:none;opacity:1}
}
@media (max-width:760px),(max-aspect-ratio:4/5){
  .gloss-body .gexp,.gloss-ex .gextext{font-size:15.5px;line-height:1.85}
  button.gterm{padding:2px 5px 3px;min-height:1.85em;font-weight:700;border-bottom-width:2px}
}

/* glossary hint on detail cards */
.gloss-hint{
  display:flex;align-items:flex-start;gap:8px;
  margin:0 0 12px;padding:10px 12px;
  background:linear-gradient(135deg,rgba(196,90,122,.14),rgba(231,173,63,.10));
  border:1px dashed rgba(154,61,92,.45);border-radius:12px;
  font-size:13.5px;line-height:1.65;font-weight:650;color:#7a2d48;
}
.gloss-hint .gh-ico{flex:0 0 auto;font-size:16px;line-height:1.4}
.gsec{margin:0 0 12px}
.gsec h4{
  margin:0 0 6px;font-size:12.5px;font-weight:800;letter-spacing:.02em;
  color:#9a3d5c;text-transform:none;
}
.gsec p,.gsec .gbody{margin:0;font-size:15.5px;line-height:1.85;color:#3b2f42}
body.lang-en .gsec p,body.lang-en .gsec .gbody{line-height:1.65}
.gsample{
  background:linear-gradient(160deg,rgba(160,114,155,.10),rgba(242,122,94,.08));
  border:1px solid rgba(90,40,70,.12);border-radius:14px;padding:12px 14px;margin:0 0 14px;
}
.gsample .glab{display:inline-block;font-size:11px;font-weight:800;color:#9a3d5c;background:#fff;border-radius:999px;padding:2px 10px;margin-bottom:8px}
.gsample .gq{font-size:15px;line-height:1.8;font-weight:700;color:#3b2f42;margin:0 0 8px}
.gsample .gsteps{margin:0 0 8px;padding-inline-start:1.2em;font-size:14.5px;line-height:1.75;color:#3b2f42}
.gsample .gsteps li{margin:0 0 4px}
.gsample .gans{
  margin:0;padding:8px 10px;border-radius:10px;
  background:rgba(255,255,255,.85);border:1px solid rgba(154,61,92,.2);
  font-size:14.5px;line-height:1.7;font-weight:700;color:#7a2d48;
}
.gsample .gdiag,.gsample .gtable{display:block;width:min(100%,280px);margin:8px auto;overflow-x:auto}
.gsample table{border-collapse:collapse;font-size:13px;width:100%}
.gsample th,.gsample td{border:1px solid rgba(90,40,70,.18);padding:5px 8px;text-align:center}
.gsample th{background:rgba(196,90,122,.12);font-weight:800}
.pc .gsample{margin-top:4px}


/* ============================================================
   Embossed clay plaques (CSS2D captions restyled as letterpress)
   ============================================================ */
.lbl.clay-plaque{
  --pl:#f7f0e6;
  --ink-pl:#2a1810;
  --edge-pl:rgba(170,140,110,.28);
  --node-pl:#f27a5e;
  --sway:0deg;
  position:relative;
  display:flex;align-items:center;gap:5px;
  padding:4px 10px 4px 4px;
  border-radius:11px;
  background:
    linear-gradient(160deg, #fffdf8 0%, var(--pl) 45%, #efe6d8 100%);
  border:1px solid var(--edge-pl);
  /* soft clay bevel — no heavy dark outline */
  box-shadow:
    inset 1px 1px 0 rgba(255,255,255,.95),
    inset -1px -1px 0 rgba(90,55,25,.12),
    inset 0 2px 3px rgba(255,255,255,.35),
    inset 0 -2px 3px rgba(70,40,15,.08),
    0 3px 8px -3px rgba(60,30,10,.26),
    0 1px 2px rgba(60,30,10,.12);
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  white-space:normal;
  transition:transform .18s ease, box-shadow .18s ease, opacity .25s;
  background-image:
    radial-gradient(circle at 20% 25%, rgba(255,255,255,.5) 0 1px, transparent 2px),
    radial-gradient(circle at 70% 70%, rgba(90,50,20,.05) 0 1px, transparent 2px),
    linear-gradient(160deg, #fffdf8 0%, var(--pl) 45%, #efe6d8 100%);
  background-size:8px 8px, 10px 10px, auto;
}
.lbl.clay-plaque .num{
  display:inline-grid;place-items:center;
  min-width:22px;height:22px;border-radius:50%;
  color:#fff;font-weight:800;font-size:12px;flex:0 0 auto;
  /* embossed badge */
  box-shadow:
    0 1px 0 rgba(255,255,255,.35) inset,
    0 -1px 0 rgba(0,0,0,.22) inset,
    0 2px 4px -1px rgba(0,0,0,.28);
  text-shadow:0 1px 0 rgba(0,0,0,.25), 0 -0.5px 0 rgba(255,255,255,.25);
}
.lbl.clay-plaque .tx{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.lbl.clay-plaque .tx b{
  font-weight:800;font-size:13.5px;max-width:9.5rem;
  color:var(--ink-pl);
  white-space:normal;overflow:hidden;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;
  /* raised emboss: light above-left + dark below-right */
  text-shadow:
    -1px -1px 0 rgba(255,255,255,.9),
    1px 1px 0 rgba(40,20,10,.28);
}
.lbl.clay-plaque .tx i{display:none!important}
.lbl.clay-plaque.topic .tx b{font-size:13px;max-width:10rem}
.lbl.clay-plaque.found .tx b{font-size:12.5px;font-weight:700;max-width:6.5rem}
.lbl.clay-plaque.hover{
  transform:translateY(-2px) scale(1.03);
  box-shadow:
    inset 1px 1px 0 rgba(255,255,255,.98),
    inset -1px -1px 0 rgba(90,55,25,.14),
    0 6px 12px -3px rgba(60,30,10,.30),
    0 2px 4px rgba(60,30,10,.16);
}
/* Center plaque — larger, mild rotateY sway */
.lbl.clay-plaque.center{
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:10px 16px 9px;border-radius:14px;gap:2px;
  transform:perspective(420px) rotateY(var(--sway));
  transform-style:preserve-3d;
  will-change:transform;
}
.lbl.clay-plaque.center .ttl{
  font-weight:800;font-size:18px;letter-spacing:-.2px;
  color:var(--ink-pl);
  text-shadow:
    -1px -1px 0 rgba(255,255,255,.92),
    1px 1px 0 rgba(40,20,10,.30);
}
.lbl.clay-plaque.center .en{font-size:11px;color:rgba(60,40,30,.62);direction:ltr}
.lbl.clay-plaque.center .num.big{
  min-width:30px;height:30px;font-size:15px;margin-bottom:3px;
}
.lbl.clay-plaque.rooftop{
  box-shadow:
    inset 1px 1px 0 rgba(255,255,255,.95),
    inset -1px -1px 0 rgba(90,55,25,.12),
    inset 0 2px 3px rgba(255,255,255,.35),
    inset 0 -2px 3px rgba(70,40,15,.08),
    0 3px 7px -2px rgba(60,30,10,.24),
    0 1px 2px rgba(60,30,10,.12);
}
.lbl.clay-plaque.rooftop::after{display:none}
.lbl.clay-plaque.on-icon{
  /* plaque sits on icon top — contact shadow only */
  box-shadow:
    inset 1px 1px 0 rgba(255,255,255,.95),
    inset -1px -1px 0 rgba(90,55,25,.12),
    0 4px 10px -3px rgba(60,30,10,.30),
    0 1px 2px rgba(60,30,10,.14);
}
.lbl.clay-plaque.on-icon::after{display:none}

/* Mobile sizes: 13–14px ring, 16–17px center bold; constant screen size */
@media (max-width:760px),(max-aspect-ratio:4/5){
  .lbl.clay-plaque.ka,
  .lbl.clay-plaque.topic,
  .lbl.clay-plaque.found{
    gap:3px;padding:2px 6px 2px 2px;max-width:28vw;border-radius:9px;
  }
  .lbl.clay-plaque .num{min-width:17px;height:17px;font-size:10px}
  .lbl.clay-plaque.ka,
  .lbl.clay-plaque.topic,
  .lbl.clay-plaque.found{
    max-width:36vw!important;
  }
  .lbl.clay-plaque .tx b{
    font-size:12.5px!important;max-width:6.2rem;line-height:1.18;
    -webkit-line-clamp:2;-webkit-box-orient:vertical;
    overflow:hidden;white-space:normal;text-overflow:clip;display:-webkit-box;
  }
  .lbl.clay-plaque.topic .tx b{font-size:12px!important;max-width:6.4rem}
  .lbl.clay-plaque.topic{padding:2px 6px 2px 2px!important;max-width:38vw!important;gap:2px!important}
  .lbl.clay-plaque.found .tx b{font-size:12px!important;max-width:5.6rem}
  .lbl.clay-plaque .tx i{display:none}
  .lbl.clay-plaque.center{
    display:inline-flex!important;flex-direction:row!important;flex-wrap:nowrap!important;
    justify-content:center;align-items:center;gap:5px;
    padding:7px 14px!important;border-radius:13px!important;
    width:max-content!important;min-width:0!important;max-width:72vw!important;
    transform:perspective(380px) rotateY(var(--sway));
    z-index:24!important;opacity:1!important;visibility:visible!important;
  }
  .lbl.clay-plaque.center .num.big{min-width:20px;height:20px;font-size:11px;margin:0}
  .lbl.clay-plaque.center .ttl{
    font-size:16.5px!important;font-weight:800;max-width:46vw;
    white-space:normal!important;line-height:1.15;text-align:center;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  }
  .lbl.clay-plaque.center .en,.lbl.clay-plaque.center .hint{display:none!important}
}
@media (pointer:coarse){
  .lbl.clay-plaque.ka,.lbl.clay-plaque.topic,.lbl.clay-plaque.found{padding:2px 6px 2px 2px}
  .lbl.clay-plaque.center{padding:7px 14px!important}
}

.lbl.clay-plaque.under::after{display:none}

.lbl.clay-plaque.on-icon{z-index:2}
@media (max-width:760px),(max-aspect-ratio:4/5){
  .lbl.clay-plaque.on-icon.center{
    max-width:72vw!important;
    padding:7px 14px!important;
    z-index:24!important;
  }
  .lbl.clay-plaque.on-icon.center .ttl{
    font-size:16.5px!important;max-width:46vw;font-weight:800;
    white-space:normal!important;line-height:1.15;text-align:center;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  }
  .lbl.clay-plaque.on-icon.center .num.big{min-width:18px;height:18px;font-size:10px;margin:0}
}

@media (min-width:761px){
  .lbl.clay-plaque.on-icon.center{max-width:280px;padding:10px 18px;z-index:24!important}
  .lbl.clay-plaque.on-icon.center .ttl{font-size:18px;font-weight:800;max-width:260px;white-space:nowrap;overflow:visible;text-overflow:clip}
  .lbl.clay-plaque.center .ttl{font-size:18px;font-weight:800}
}

.lbl.clay-plaque.found-compact{
  padding:2px 6px 2px 2px!important;max-width:30vw!important;gap:2px!important;
}
.lbl.clay-plaque.found-compact .tx b{
  font-size:12px!important;max-width:5.4rem!important;
  white-space:normal!important;overflow:hidden!important;
  display:-webkit-box!important;-webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;text-overflow:clip!important;
}