/* ================= X-RAY（裏側モード）: 全ページ共通の部品 =================
   ボタン1つで、ページを設計図の見た目にし、各ブロックの「入った版・重さ」と素材の出どころ（生成AIか）を重ねて出す。
   数字はこのブラウザでいま測った値（Performance API）。ページの作りには手を入れず、上に1枚重ねるだけ */
.xr-btn{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));z-index:70;
  display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 15px;border-radius:999px;border:1px solid rgba(240,169,43,.55);
  background:rgba(8,8,10,.8);color:#f4f1ea;font:700 10.5px/1 ui-monospace,"SF Mono",Menlo,Consolas,"Courier New",monospace;letter-spacing:.18em;
  cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:opacity .25s,transform .25s,visibility .25s,background .2s,color .2s}
.xr-btn svg{width:15px;height:15px;flex:none;color:#f0a92b}
.xr-btn:hover,.xr-btn[aria-pressed="true"]{background:#f0a92b;border-color:#f0a92b;color:#12100b}
.xr-btn:hover svg,.xr-btn[aria-pressed="true"] svg{color:#12100b}
.xr-btn:focus-visible{outline:2px solid #f0a92b;outline-offset:3px}
.xr-btn.is-away{opacity:0;visibility:hidden;transform:translateY(12px)}
@media (max-width:560px){.xr-btn{width:44px;height:44px;padding:0;justify-content:center}.xr-btn .lbl{display:none}}
.xr-layer{position:absolute;left:0;top:0;z-index:55;pointer-events:none;
  background-image:linear-gradient(rgba(240,169,43,.075) 1px,transparent 1px),linear-gradient(90deg,rgba(240,169,43,.075) 1px,transparent 1px);
  background-size:24px 24px}
.xr-layer[hidden]{display:none}
.xr-box{position:absolute;border:1px dashed rgba(240,169,43,.8);border-radius:2px}
.xr-box.m{border-style:dotted;border-color:rgba(130,205,255,.75)}
.xr-tag{position:absolute;left:-1px;top:-1px;max-width:calc(100% + 2px);padding:3px 8px;background:#f0a92b;color:#12100b;
  font:700 10px/1.45 ui-monospace,"SF Mono",Menlo,Consolas,"Courier New",monospace;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xr-box.m .xr-tag{top:auto;bottom:-1px;background:rgba(8,8,10,.88);color:#aee0ff;border:1px solid rgba(130,205,255,.6);font-weight:600}
html.xr :is(img,video){filter:grayscale(1) brightness(.72) contrast(1.15)!important}
html.xr body :is(section,article,header,footer,nav,a,p,h1,h2,h3,li,figure,form,fieldset,label):not(:focus-visible):not(.xr-hud *){outline:1px solid rgba(240,169,43,.13);outline-offset:-1px}
.xr-scan{position:fixed;left:0;right:0;top:0;height:2px;z-index:80;pointer-events:none;background:#f0a92b;
  box-shadow:0 0 22px 3px rgba(240,169,43,.75);animation:xrScan .75s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes xrScan{from{transform:translateY(0)}88%{opacity:1}to{transform:translateY(100vh);opacity:0}}
.xr-hud{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:calc(66px + env(safe-area-inset-bottom));z-index:70;
  width:min(340px,calc(100vw - 32px));max-height:min(64vh,540px);overflow:auto;padding:14px 16px 12px;border-radius:10px;
  border:1px solid rgba(240,169,43,.5);background:rgba(8,8,10,.92);color:#f4f1ea;box-shadow:0 20px 60px rgba(0,0,0,.55);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  font:12px/1.7 "Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP",system-ui,-apple-system,"Segoe UI",sans-serif}
.xr-hud[hidden]{display:none}
.xr-hud .xr-h{display:flex;align-items:center;gap:10px;margin:0 0 10px}
.xr-hud h2{margin:0;font:700 11px/1.4 ui-monospace,"SF Mono",Menlo,Consolas,"Courier New",monospace;letter-spacing:.2em;color:#f0a92b}
.xr-hud h2 span{margin-left:8px;font:600 11px/1.4 "Hiragino Sans","Noto Sans JP",system-ui,sans-serif;letter-spacing:.04em;color:#a09c94}
.xr-hud .xr-x{margin-left:auto;appearance:none;width:30px;height:30px;border-radius:50%;border:1px solid rgba(244,241,234,.18);
  background:transparent;color:#f4f1ea;display:grid;place-items:center;cursor:pointer}
.xr-hud .xr-x:hover{border-color:#f0a92b;color:#f0a92b}
.xr-hud .xr-x:focus-visible{outline:2px solid #f0a92b;outline-offset:2px}
.xr-hud .xr-x svg{width:13px;height:13px}
.xr-hud dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:7px 12px}
.xr-hud dt{color:#a09c94;font-size:11px;white-space:nowrap}
.xr-hud dd{margin:0;font:11.5px/1.6 ui-monospace,"SF Mono",Menlo,Consolas,"Courier New",monospace;overflow-wrap:anywhere}
.xr-hud .xr-n{margin:11px 0 0;padding-top:9px;border-top:1px solid rgba(244,241,234,.1);font-size:10.5px;line-height:1.75;color:#a09c94}
@media (max-width:560px){.xr-hud{left:12px;right:12px;width:auto;bottom:calc(70px + env(safe-area-inset-bottom));max-height:48vh}}
@media (prefers-reduced-motion:reduce){.xr-btn{transition:none}.xr-scan{display:none}}