/* 奥義のカットイン（ougi-fx.js）：暗転 → 国の色の漫画のコマ枠がバンと入る → 技名の筆文字 → 抜ける */
.og-cut{position:absolute;inset:0;z-index:90;pointer-events:none;overflow:hidden}
.og-cut .og-dim{position:absolute;inset:0;background:#000;opacity:0;transition:opacity .15s}
.og-cut.in .og-dim{opacity:.6}
.og-cut .og-panel{position:absolute;left:-4%;right:-4%;top:30%;aspect-ratio:3/1;border:6px solid #111;outline:4px solid #fff;background:#fff;transform:translateX(110%) skewY(-4deg);transition:transform .2s cubic-bezier(.2,1.4,.5,1);overflow:hidden;box-shadow:0 8px 0 #0008}
.og-cut.c-red .og-panel{border-color:#7a1208}.og-cut.c-blue .og-panel{border-color:#10306a}.og-cut.c-yellow .og-panel{border-color:#7a5a08}.og-cut.c-green .og-panel{border-color:#1e5a24}
.og-cut.in .og-panel{transform:translateX(0) skewY(-4deg)}
.og-cut .og-face{width:100%!important;height:100%!important;object-fit:cover;display:block;filter:contrast(1.1)}
.og-cut .og-lines{position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 50% 50%,#0000 0 3deg,#0003 3deg 4deg);mix-blend-mode:multiply;animation:ogLines .2s steps(2) infinite}
@keyframes ogLines{50%{transform:rotate(2deg) scale(1.02)}}
/* 2026-10-24 ユーザー：技名が顔にかぶる → コマの右下にかける（コマの下ふち＝30cqh+36cqw） */
.og-cut{container-type:size}
.og-cut .og-name{position:absolute;right:2cqw;left:auto;width:60cqw!important;height:auto!important;top:calc(30cqh + 36cqw - 11cqw);opacity:0;transform:scale(2.6) rotate(-6deg);transform-origin:80% 50%}
.og-cut.name .og-name{opacity:1;transform:rotate(-4deg);transition:transform .2s cubic-bezier(.2,1.6,.5,1),opacity .1s}
.og-cut.out .og-panel{transform:translateX(-120%) skewY(-4deg);transition:transform .2s ease-in}
.og-cut.out .og-name,.og-cut.out .og-dim{opacity:0;transition:opacity .2s}
/* コマの覚醒中：枠が黒い炎で焼けてやぶれる（今は黒く焦がすだけ。絵ができたら差しかえ） */
.og-cut.awake .og-panel{border-color:#000;outline-color:#2a0a04;box-shadow:0 0 30px 10px #1a0000,inset 0 0 40px #000}
/* 2026-10-26 焼けてやぶれた枠の絵（frame_awake.png 1200×376。内側の穴 およそ x120〜1085・y85〜295）。穴の左右をコマの左右（-4〜104cqw）に合わせ、高さは少しのばしてコマの上下のふちを焼く。コマと同じ距離だけ同じ速さで動く */
.og-cut.awake.burn .og-panel{border-color:#000;outline:0;box-shadow:none}
.og-cut .og-burn{position:absolute;left:-17.4cqw;width:134cqw!important;height:56cqw!important;top:calc(30cqh + 18cqw - 27.4cqw);max-width:none;object-fit:fill;pointer-events:none;transform:translateX(118.8cqw) skewY(-4deg);transition:transform .2s cubic-bezier(.2,1.4,.5,1)}
.og-cut.in .og-burn{transform:translateX(0) skewY(-4deg)}
.og-cut.out .og-burn{transform:translateX(-129.6cqw) skewY(-4deg);transition:transform .2s ease-in}
/* 大技の連続コマ（横8コマ） */
.og-big{position:absolute;z-index:58;pointer-events:none;transform:translate(-50%,-55%);background-size:800% 100%;background-repeat:no-repeat;animation:ogBig var(--ms,760ms) steps(8,jump-none) forwards}
@keyframes ogBig{from{background-position-x:0%}to{background-position-x:100%}}
.b3-skills button.ougi small{color:#b01a08;font-weight:900}
/* 2026-10-29 奥義の幻影（キャラ専用）：敵のまわりにぱっと出て、敵に向かって打ちこみ、消える */
.og-ph{position:absolute;z-index:59;pointer-events:none;transform:translate(-50%,-50%);background-size:200% 100%;background-repeat:no-repeat;opacity:0;animation:ogPh var(--ms,320ms) ease-out forwards;filter:drop-shadow(0 0 8px var(--glow,#ffb030))}
@keyframes ogPh{0%{opacity:0;scale:1.5}25%{opacity:.82;scale:1}70%{opacity:.72;translate:var(--dx) var(--dy)}100%{opacity:0;translate:var(--dx) var(--dy);scale:.9}}
@media (prefers-reduced-motion: reduce){.og-ph{animation-duration:1ms}}
.og-ph.flip{transform:translate(-50%,-50%) scaleX(-1)}
/* 2026-10-29 ユーザー：カットインの上下に国の飾り（赤＝炎・青＝水・黄＝いかずち・緑＝蔦）。技名がいちばん手前 */
.og-cut .og-panel{overflow:visible}
.og-cut .og-edge{position:absolute;left:-3%;width:106%!important;height:38%!important;object-fit:fill;pointer-events:none;z-index:2}
/* 帯はコマの線から外へ：上はコマの上の線から上へ、下はコマの下の線から下へ（ユーザー） */
.og-cut .og-edge.top{bottom:100%;top:auto}
.og-cut .og-edge.bot{top:100%;bottom:auto;transform:scaleY(-1)}
.og-cut .og-name{z-index:5}