/* deck07.css — 登壇セミナー営業デッキ用スタイル（07セミナー視覚DNA）
   reference-template.css の .xop-slide / .xop-canvas / .semantic-layer / corner-stripes /
   watermark / tone-* を踏襲。会社名・透かしは自社ブランドに差し替えて使う。
   semantic-layer は固定 1920x1080 を --xs でスケールする方式。 */

*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#0b0b0d;
  font-family:"YuGothic","Yu Gothic","Hiragino Sans","Hiragino Kaku Gothic ProN",
  "Noto Sans JP",Inter,-apple-system,BlinkMacSystemFont,sans-serif;color:#101010}

/* ===== 07 ステージ／スライド枠 ===== */
.deck-stage{width:100vw;height:100vh;display:grid;place-items:center;overflow:hidden}
.xop-slide{width:100vw;height:100vh;display:none;place-items:center;background:#0b0b0d}
.xop-slide.is-active{display:grid}
.xop-canvas{position:relative;width:min(100vw,177.7778vh);height:min(56.25vw,100vh);
  aspect-ratio:16/9;overflow:hidden;background:#f7f6f1;box-shadow:0 0 0 1px rgba(255,255,255,.12);isolation:isolate}
.tone-dark .xop-canvas{background:#050608}
.tone-minimal .xop-canvas{background:#f7f6f2}
.tone-brand .xop-canvas{background:#050608}

/* semantic-layer = 固定1920x1080キャンバスをスケール（07と同方式） */
.semantic-layer{position:absolute;left:0;top:0;width:1920px;height:1080px;
  transform-origin:top left;transform:scale(var(--xs,1));z-index:5;pointer-events:none}
.semantic-layer *{box-sizing:border-box}

/* ===== 07 角ストライプ装飾 ===== */
.corner-stripes{position:absolute;left:-22px;top:-20px;width:170px;height:150px;opacity:.72;
  background:repeating-linear-gradient(135deg,#0b0b0b 0 10px,transparent 10px 20px);
  clip-path:polygon(0 0,100% 0,0 100%);z-index:9;pointer-events:none}
.tone-dark .corner-stripes,.tone-brand .corner-stripes{opacity:.24;
  background:repeating-linear-gradient(135deg,#fff 0 10px,transparent 10px 20px)}

/* ===== 07 透かしマーク（自社の会社マークに置換・薄く） ===== */
.brand-watermark{position:absolute;left:50%;bottom:-3%;width:13%;height:13%;
  transform:translateX(-50%);opacity:.13;z-index:8;pointer-events:none;
  display:flex;align-items:center;justify-content:center;
  font-weight:950;font-size:22px;letter-spacing:.04em;color:#1a1a2e}
.tone-dark .brand-watermark,.tone-brand .brand-watermark{color:rgba(255,255,255,.5);opacity:.16}

/* ===== 07 黄色ハイライト ===== */
.ug{background:linear-gradient(transparent 62%,#f5d020 62%);padding:0 .08em}
.hl{background:#f5d020;padding:0 12px}

/* ===== 共通フォント色 ===== */
.sem-paper{position:absolute;inset:0;background:#f7f6f1;color:#111;overflow:hidden;
  font-family:inherit}
.sem-dark{position:absolute;inset:0;color:#fff;overflow:hidden;font-family:inherit;
  background:radial-gradient(circle at 18% 8%,rgba(255,255,255,.16),transparent 32%),
  radial-gradient(circle at 82% 76%,rgba(145,153,166,.28),transparent 36%),
  linear-gradient(135deg,#050608 0%,#15181f 48%,#343941 100%)}
.sem-brand{position:absolute;inset:0;color:#fff;overflow:hidden;font-family:inherit;
  background:radial-gradient(circle at 16% 10%,rgba(255,255,255,.18),transparent 30%),
  radial-gradient(circle at 86% 82%,rgba(155,165,178,.28),transparent 35%),
  linear-gradient(145deg,#050608 0%,#15181f 34%,#343941 64%,#0b0d12 100%)}
.sem-white{position:absolute;inset:0;background:#fff;color:#111;overflow:hidden;font-family:inherit}

/* 07 ハードシャドウ白カード */
.card-hard{background:#fff;border:3px solid #111;box-shadow:10px 10px 0 #111}

/* ===== ナビ（07と同じ、薄く） ===== */
.deck-nav{position:fixed;right:14px;top:12px;z-index:200;display:flex;gap:8px;opacity:.1;
  font-family:sans-serif;transition:opacity .2s}
.deck-nav:hover{opacity:1}
.deck-nav button,.deck-nav select{background:#1c1c1c;color:#fff;border:1px solid #444;
  border-radius:6px;padding:4px 10px;font-size:13px;cursor:pointer}
