@import url("fonts/extra.css");
/* QR-only composition. Shared typography, card widths, CTA and shell are reused. */
.product-lp[data-product-theme="raku-qr"] .lp-hero-wrap { background:radial-gradient(ellipse 480px 360px at 85% 30%,#f1e5fc,transparent 80%),linear-gradient(110deg,#fff 34%,#f4faff 100%); }
.product-lp[data-product-theme="raku-qr"] .lp-hero { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px; }
.product-lp[data-product-theme="raku-qr"] .lp-product-icon { background:#fff; width:72px; height:72px; border-radius:18px; }
.product-lp[data-product-theme="raku-qr"] .lp-product-name-row { gap:14px; }
.product-lp[data-product-theme="raku-qr"] .lp-product-name { font-size:42px; white-space:normal; letter-spacing:-.05em; line-height:1.3; margin:0; }
.product-lp[data-product-theme="raku-qr"] .lp-hero-h2 { font-size:34px; text-wrap:initial; }
.product-lp[data-product-theme="raku-qr"] .lp-hero-line { display:block; }
.product-lp[data-product-theme="raku-qr"] .lp-hero-stage { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px 16px; align-content:center; }
.product-lp[data-product-theme="raku-qr"] .lp-hero-ui { position:relative; grid-column:1/-1; inset:auto; min-height:0; transform:none; }
.product-lp[data-product-theme="raku-qr"] .lp-hero-ui-bar { background:var(--lp-accent-soft); gap:10px; }
.product-lp[data-product-theme="raku-qr"] .qr-demo-label { font-size:13px; color:var(--lp-accent-accent); border:1px solid var(--lp-accent-border); padding:2px 8px; border-radius:4px; white-space:nowrap; }
.product-lp[data-product-theme="raku-qr"] .lp-hero-mascot { position:relative; grid-column:1; grid-row:2; width:100%; max-width:240px; inset:auto; align-self:center; filter:none; background:transparent; }
.product-lp[data-product-theme="raku-qr"] .lp-stat-panel { position:relative; grid-column:2; grid-row:2; width:auto; inset:auto; align-self:center; transform:none; border-color:var(--lp-accent-border); }
.product-lp[data-product-theme="raku-qr"] .lp-stat-title { color:var(--lp-accent-accent); }
.product-lp[data-product-theme="raku-qr"] .lp-hero-caption { grid-column:1/-1; text-align:right; font-size:14px; color:var(--lp-note); }
.product-lp[data-product-theme="raku-qr"] .qr-cta-note { margin:14px 0 0; font-size:var(--lp-note-size); color:var(--lp-note); }
.product-lp[data-product-theme="raku-qr"] .qr-cta-note-center { text-align:center; padding-inline:20px; }
.product-lp[data-product-theme="raku-qr"] .qr-symbol { display:block; width:88px; height:88px; flex:none; color:#34303b; background:#fff; padding:6px; }
.product-lp[data-product-theme="raku-qr"] .qr-scan-flow { display:grid; grid-template-columns:auto auto minmax(0,1fr); align-items:center; gap:16px; }
.product-lp[data-product-theme="raku-qr"] .qr-tag { display:grid; justify-items:center; gap:4px; padding:12px; background:#fff; border:1px solid var(--lp-accent-border); border-radius:8px; font-size:15px; }
.product-lp[data-product-theme="raku-qr"] .qr-tag strong { font-size:20px; }
.product-lp[data-product-theme="raku-qr"] .qr-scan-arrow { font-size:28px; font-weight:700; color:var(--lp-accent-accent); }
.product-lp[data-product-theme="raku-qr"] .qr-label { display:block; font-size:var(--lp-note-size); color:var(--lp-note); }
.product-lp[data-product-theme="raku-qr"] .qr-hero-record > strong { display:block; font-size:18px; margin:4px 0 14px; }
.product-lp[data-product-theme="raku-qr"] dl { margin:0; }
.product-lp[data-product-theme="raku-qr"] dl > div { display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px 12px; padding:8px 0; border-bottom:1px solid #e4ddeb; font-size:15px; }
.product-lp[data-product-theme="raku-qr"] dd { margin:0; font-weight:700; }
.product-lp[data-product-theme="raku-qr"] .lp-feature-intro { font-size:var(--lp-copy-size); line-height:var(--lp-copy-leading); margin:0 0 var(--lp-list-gap); color:var(--lp-note); }
.product-lp[data-product-theme="raku-qr"] .lp-qr-scenes { grid-template-columns:minmax(0,42fr) minmax(0,58fr); }
.product-lp[data-product-theme="raku-qr"] #how-to .lp-scene-problem strong, .product-lp[data-product-theme="raku-qr"] #how-to .lp-scene-solution strong { display:block; margin-bottom:8px; }
.product-lp[data-product-theme="raku-qr"] #how-to .lp-scene-solution { margin-top:24px; }
.product-lp[data-product-theme="raku-qr"] .lp-work-visual { align-content:center; gap:20px; }
.product-lp[data-product-theme="raku-qr"] .lp-mock-caption { position:static; text-align:center; justify-self:center; margin:0; font-size:var(--lp-note-size); }
.product-lp[data-product-theme="raku-qr"] .lp-scene-diagram { width:100%; min-width:0; font-size:var(--lp-copy-size); line-height:1.6; }
.product-lp[data-product-theme="raku-qr"] .qr-record-source { padding:16px 20px; background:var(--lp-accent-soft); border:1px solid var(--lp-accent-border); border-radius:8px; }
.product-lp[data-product-theme="raku-qr"] .qr-record-source > strong { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:24px; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-code-value { color:var(--lp-accent-accent); font-size:28px; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-flow-arrow { text-align:center; font-size:30px; line-height:1.4; color:var(--lp-accent-accent); margin:16px 0; font-weight:700; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-flow-arrow span { font-size:var(--lp-note-size); vertical-align:middle; }
.product-lp[data-product-theme="raku-qr"] .qr-phone { border:3px solid #4c3b60; border-radius:20px; padding:12px 18px 18px; background:#fff; min-width:0; }
.product-lp[data-product-theme="raku-qr"] .qr-phone-speaker { margin:0 auto 14px; width:36px; height:4px; border-radius:3px; background:#4c3b60; }
.product-lp[data-product-theme="raku-qr"] .qr-phone > strong { font-size:22px; display:block; margin-top:4px; }
.product-lp[data-product-theme="raku-qr"] .qr-phone-end { display:block; margin-top:16px; text-align:center; border-radius:6px; padding:8px 6px; background:var(--lp-accent-soft); font-size:15px; font-weight:700; }
.product-lp[data-product-theme="raku-qr"] .qr-compare { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:12px; align-items:center; }
.product-lp[data-product-theme="raku-qr"] .qr-compare-card { text-align:center; padding:24px 12px; border:1px solid #d9deea; border-radius:10px; background:#f7f9fc; }
.product-lp[data-product-theme="raku-qr"] .qr-compare-card > strong { display:block; font-size:36px; line-height:1.5; margin-top:4px; }
.product-lp[data-product-theme="raku-qr"] .qr-compare-card.qr-read { border-color:var(--lp-accent-border); background:var(--lp-accent-soft); }
.product-lp[data-product-theme="raku-qr"] .qr-compare-sign { font-size:28px; }
.product-lp[data-product-theme="raku-qr"] .qr-result { display:flex; justify-content:center; gap:20px; align-items:center; padding:20px; border-radius:12px; border:2px solid #d99da0; background:#fff2f2; }
.product-lp[data-product-theme="raku-qr"] .qr-result strong { display:block; font-size:40px; line-height:1.3; }
.product-lp[data-product-theme="raku-qr"] .qr-result p { margin:4px 0 0; font-size:18px; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-result-icon { color:#b62c3b; font-size:60px; line-height:1; }
.product-lp[data-product-theme="raku-qr"] .qr-ok-example { display:flex; align-items:center; gap:20px; margin-top:24px; font-size:17px; padding:16px; border:1px solid #b8d6cb; border-radius:8px; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-ok-mark { color:#16654c; font-weight:700; white-space:nowrap; }
.product-lp[data-product-theme="raku-qr"] .qr-stock-before, .product-lp[data-product-theme="raku-qr"] .qr-stock-after { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding:18px 22px; border:1px solid #d9deea; border-radius:8px; background:#f7f9fc; }
.product-lp[data-product-theme="raku-qr"] .qr-stock-after { background:var(--lp-accent-soft); border-color:var(--lp-accent-border); }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-quantity { font-size:44px; line-height:1.2; color:var(--lp-accent-accent); }
.product-lp[data-product-theme="raku-qr"] .qr-quantity span { font-size:18px; margin-left:6px; }
.product-lp[data-product-theme="raku-qr"] .qr-stock-action { display:flex; align-items:center; justify-content:center; gap:20px; }
.product-lp[data-product-theme="raku-qr"] .qr-stock-action .qr-symbol { width:64px; height:64px; }
.product-lp[data-product-theme="raku-qr"] .qr-stock-action span, .product-lp[data-product-theme="raku-qr"] .qr-stock-action strong { display:block; }
.product-lp[data-product-theme="raku-qr"] .qr-stock-action b { font-size:28px; }
.product-lp[data-product-theme="raku-qr"] .qr-history { display:flex; align-items:center; gap:12px; margin-top:20px; padding:16px 20px; border-radius:8px; border:1px solid var(--lp-accent-border); }
.product-lp[data-product-theme="raku-qr"] .qr-history > span { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:var(--lp-accent-soft); }
.product-lp[data-product-theme="raku-qr"] .qr-history strong, .product-lp[data-product-theme="raku-qr"] .qr-history div > span { display:block; }
.product-lp[data-product-theme="raku-qr"] .qr-history div > span { font-size:var(--lp-note-size); margin-top:4px; }
.product-lp[data-product-theme="raku-qr"] .lp-scene-guide { grid-column:1/-1; padding:var(--lp-card-padding); border-top:1px solid #d4e8f5; }
.product-lp[data-product-theme="raku-qr"] .lp-scene-steps { list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--lp-column-gap); padding:0; margin:0; font-size:var(--lp-copy-size); line-height:var(--lp-copy-leading); }
.product-lp[data-product-theme="raku-qr"] .lp-scene-steps li { display:flex; align-items:flex-start; gap:12px; min-width:0; }
.product-lp[data-product-theme="raku-qr"] .lp-scene-steps .lp-step-num { flex:none; margin-top:2px; }
.product-lp[data-product-theme="raku-qr"] .lp-scene-effect { margin:28px 0 0; padding:16px; text-align:center; background:var(--lp-accent-soft); font-weight:700; font-size:var(--lp-card-title-size); border-radius:8px; }
.product-lp[data-product-theme="raku-qr"] .lp-scene-note { margin:20px 0 0; font-size:var(--lp-note-size); line-height:1.8; }
.product-lp[data-product-theme="raku-qr"] .lp-commercial-note { font-size:var(--lp-note-size); color:var(--lp-note); margin:24px 0 0; }
.product-lp[data-product-theme="raku-qr"] .lp-pricing-main > p:last-child { font-size:var(--lp-copy-size); margin:0; }
@media (max-width:1180px) and (min-width:921px) {
  .product-lp[data-product-theme="raku-qr"] .lp-product-name { font-size:36px; }
  .product-lp[data-product-theme="raku-qr"] .lp-product-icon { width:64px; height:64px; }
  .product-lp[data-product-theme="raku-qr"] .lp-hero-h2 { font-size:29px; }
}
@media (max-width:920px) {
  .product-lp[data-product-theme="raku-qr"] .lp-hero, .product-lp[data-product-theme="raku-qr"] .lp-qr-scenes { grid-template-columns:minmax(0,1fr); }
  .product-lp[data-product-theme="raku-qr"] .lp-hero-lead { max-width:650px; }
  .product-lp[data-product-theme="raku-qr"] .lp-hero-stage { min-height:0; max-width:650px; width:100%; margin:28px auto 12px; }
}
@media (max-width:600px) {
  .product-lp[data-product-theme="raku-qr"] .lp-product-name { font-size:31px; }
  .product-lp[data-product-theme="raku-qr"] .lp-product-name-row { gap:10px; }
  .product-lp[data-product-theme="raku-qr"] .lp-product-icon { width:56px; height:56px; border-radius:14px; }
  .product-lp[data-product-theme="raku-qr"] .lp-product-icon img { width:44px; height:44px; }
  .product-lp[data-product-theme="raku-qr"] .lp-hero-h2 { font-size:28px; }
  .product-lp[data-product-theme="raku-qr"] .lp-hero-stage { gap:16px 10px; }
  .product-lp[data-product-theme="raku-qr"] .lp-hero-ui-bar { padding-inline:12px; height:auto; min-height:44px; font-size:14px; flex-wrap:wrap; padding-block:8px; }
  .product-lp[data-product-theme="raku-qr"] .lp-hero-ui-body { padding:16px 12px; }
  .product-lp[data-product-theme="raku-qr"] .qr-demo-label { font-size:12px; }
  .product-lp[data-product-theme="raku-qr"] .qr-scan-flow { gap:8px; }
  .product-lp[data-product-theme="raku-qr"] .qr-tag { padding:10px 6px; font-size:14px; }
  .product-lp[data-product-theme="raku-qr"] .qr-tag .qr-symbol { width:70px; height:70px; }
  .product-lp[data-product-theme="raku-qr"] .qr-hero-record > strong { font-size:16px; }
  .product-lp[data-product-theme="raku-qr"] .qr-hero-record .qr-label { font-size:13px; }
  .product-lp[data-product-theme="raku-qr"] dl > div { font-size:14px; }
  .product-lp[data-product-theme="raku-qr"] .lp-stat-panel { padding:12px; }
  .product-lp[data-product-theme="raku-qr"] .lp-stat-line { font-size:14px; gap:8px; flex-wrap:wrap; }
  .product-lp[data-product-theme="raku-qr"] .lp-stat-line strong { font-size:15px; }
  .product-lp[data-product-theme="raku-qr"] .lp-stat-title { font-size:14px; }
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-scan-flow { grid-template-columns:minmax(0,1fr); justify-items:center; gap:12px; }
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-tag { display:grid; grid-template-columns:auto auto; column-gap:20px; width:100%; padding:12px 20px; }
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-tag .qr-symbol { grid-row:1/3; }
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-tag strong, .product-lp[data-product-theme="raku-qr"] #how-to .qr-tag span { justify-self:start; }
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-scan-arrow { transform:rotate(90deg); line-height:1; }
  .product-lp[data-product-theme="raku-qr"] .qr-phone { width:min(100%,260px); }
  .product-lp[data-product-theme="raku-qr"] .qr-compare { gap:8px; }
  .product-lp[data-product-theme="raku-qr"] .qr-compare-card { padding:18px 6px; }
  .product-lp[data-product-theme="raku-qr"] .qr-compare-card > strong { font-size:28px; }
  .product-lp[data-product-theme="raku-qr"] .qr-compare-sign { font-size:22px; }
  .product-lp[data-product-theme="raku-qr"] .qr-result { gap:14px; padding:20px 12px; }
  .product-lp[data-product-theme="raku-qr"] .qr-result p { font-size:17px; }
  .product-lp[data-product-theme="raku-qr"] .qr-ok-example { gap:12px; flex-wrap:wrap; }
  .product-lp[data-product-theme="raku-qr"] .qr-stock-before, .product-lp[data-product-theme="raku-qr"] .qr-stock-after { padding:16px; }
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-quantity { font-size:40px; }
  .product-lp[data-product-theme="raku-qr"] .qr-stock-action { gap:12px; }
  .product-lp[data-product-theme="raku-qr"] .lp-scene-steps { grid-template-columns:minmax(0,1fr); gap:20px; }
}
@media (max-width:360px) {
  .product-lp[data-product-theme="raku-qr"] .lp-product-name { font-size:28px; }
  .product-lp[data-product-theme="raku-qr"] .lp-product-name-row { gap:8px; }
  .product-lp[data-product-theme="raku-qr"] .lp-product-icon { width:48px; height:48px; }
  .product-lp[data-product-theme="raku-qr"] .lp-hero-ui .qr-scan-flow { grid-template-columns:auto minmax(0,1fr); gap:10px; }
  .product-lp[data-product-theme="raku-qr"] .lp-hero-ui .qr-scan-arrow { display:none; }
  .product-lp[data-product-theme="raku-qr"] .qr-tag .qr-symbol { width:58px; height:58px; }
  .product-lp[data-product-theme="raku-qr"] .lp-step-tab { flex-direction:column; gap:6px; text-align:center; }
}
/* QR introduction only: no scroll-driven effects and no shared animation edits. */
.qr-opening[hidden] { display:none !important; }
.qr-opening { position:fixed; inset:0; z-index:2147483000; overflow:hidden; pointer-events:auto; animation:qr-opening-safety 0s 3.3s forwards; }
.qr-opening__backdrop { display:block; position:absolute; width:100%; height:100%; inset:0; }
.qr-opening__fox { position:absolute; top:0; left:0; width:clamp(190px,28vw,420px); height:auto; transform:translate(-200% ,110vh); will-change:transform; }
html[data-qr-opening-active], html[data-qr-opening-active] body { overflow:hidden; overscroll-behavior:none; }
@keyframes qr-opening-safety { to { visibility:hidden; pointer-events:none; } }
@media (prefers-reduced-motion:reduce) { .qr-opening { display:none !important; } }
.product-lp[data-product-theme="raku-qr"] .lp-stat-title { display:block; } .product-lp[data-product-theme="raku-qr"] #how-to .lp-step-tab[aria-selected="true"] .lp-step-num { background:#e0cbf2; }

/* Read, confirm and apply: QR-only diagram internals; shared card and type scale stay intact. */
.product-lp[data-product-theme="raku-qr"] #how-to .qr-input-stage { padding:20px; border:1px solid var(--lp-accent-border); border-radius:8px; background:#fff; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-stage-title { display:flex; flex-wrap:wrap; gap:6px 12px; align-items:center; margin-bottom:16px; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-stage-title > span { font-size:var(--lp-note-size); font-weight:700; color:var(--lp-accent-accent); }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-stage-title > strong { font-size:var(--lp-card-title-size); }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-input-source { display:grid; grid-template-columns:auto minmax(0,1fr); gap:24px; align-items:center; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-input-ticket { display:grid; justify-items:center; gap:8px; font-size:var(--lp-note-size); }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-input-payload { min-width:0; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-payload > div { font-size:var(--lp-copy-size); gap:4px 12px; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-payload dd { font-size:20px; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-input-confirm { background:var(--lp-accent-soft); }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-confirm-values { display:flex; flex-wrap:wrap; gap:12px 24px; margin:0; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-confirm-values strong { font-size:24px; line-height:1.5; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-field-preview { display:grid; gap:14px; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-field-preview > div { display:grid; grid-template-columns:minmax(100px,1fr) minmax(0,2fr); gap:12px; align-items:center; padding:0; border:0; font-size:var(--lp-copy-size); }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-field-preview dd { padding:8px 14px; border:1px solid #c8bdcf; border-radius:5px; background:#fbfaff; font-size:24px; line-height:1.5; overflow-wrap:anywhere; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-compare-card.qr-read { background:#fff2f2; border-color:#d99da0; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-mismatch { color:#b62c3b; text-decoration:underline; text-underline-offset:.15em; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-result-ng strong { color:#b62c3b; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-stock-out { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding:18px 22px; border:1px solid var(--lp-accent-border); border-radius:8px; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-out-quantity { font-size:28px; line-height:1.2; }
.product-lp[data-product-theme="raku-qr"] #how-to .qr-out-quantity span { font-size:var(--lp-copy-size); margin-left:6px; }
@media (max-width:600px) {
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-input-stage { padding:16px; }
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-input-source { grid-template-columns:minmax(0,1fr); gap:16px; }
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-input-ticket { grid-template-columns:auto minmax(0,1fr); text-align:center; align-items:center; }
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-input-ticket .qr-symbol { width:70px; height:70px; }
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-field-preview > div { grid-template-columns:minmax(0,1fr); gap:6px; }
  .product-lp[data-product-theme="raku-qr"] #how-to .qr-stock-out { padding:16px; }
}
