/* アプリ詳細ページ（.ll-*）共通スタイル
   日本語版・英語版の両方から使うため、投稿本文ではなくテーマ側で管理する。
   enqueue_block_assets で読み込むので、フロントとブロックエディタの両方に適用される */
/* ═══ Lib Launcher 紹介ページ ═══════════════════════════ */
.ll, .ll *{box-sizing:border-box;}
.ll{margin:0;}
.ll img{max-width:100%;}

/* ── ショーケース ───────────────────── */
.ll-show{position:relative;overflow:hidden;border-radius:28px;padding:3.5rem 4rem;
	display:grid;grid-template-columns:300px minmax(0,1fr);gap:4rem;align-items:center;
	background:
		radial-gradient(120% 140% at 10% 5%, rgba(99,102,241,.45) 0%, rgba(99,102,241,0) 55%),
		radial-gradient(90% 120% at 95% 95%, rgba(67,56,202,.5) 0%, rgba(67,56,202,0) 52%),
		linear-gradient(155deg,#0b0a1f 0%,#151338 55%,#1e1b4b 100%);
	box-shadow:0 30px 60px -22px rgba(30,27,75,.55);}
.ll-show__media{position:relative;}
.ll-show__media::before{content:'';position:absolute;left:50%;top:50%;width:160%;height:75%;transform:translate(-50%,-50%);
	background:radial-gradient(closest-side, rgba(129,140,248,.45), rgba(129,140,248,0));}
.ll-show__media img{position:relative;z-index:1;display:block;width:100%;height:auto;filter:drop-shadow(0 28px 40px rgba(0,0,0,.55));}
.ll-show__body{min-width:0;}
.ll-show h2{font-size:1.875rem;line-height:1.45;font-weight:800;letter-spacing:-.015em;color:#fff;margin:0 0 1rem;}
.ll-show__body>p{font-size:.9375rem;line-height:1.95;color:#c9d0f0;margin:0 0 1.6rem;max-width:44em;}
.ll-eyebrow{display:inline-block;font-size:.6875rem;font-weight:800;letter-spacing:.2em;color:#c7d2fe;
	background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);padding:.45em 1em;border-radius:100px;margin:0 0 1.2rem;}
.ll-chips{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0 0 1.9rem;padding:0;}
.ll-chips li{font-size:.75rem;font-weight:600;color:#dbe1ff;background:rgba(255,255,255,.07);
	border:1px solid rgba(255,255,255,.14);border-radius:9px;padding:.45em .85em;}
.ll-cta{display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;font-weight:700;font-size:.9375rem;
	color:#fff;background:linear-gradient(135deg,#6366f1,#818cf8);padding:1rem 2.25rem;border-radius:12px;
	box-shadow:0 14px 28px -10px rgba(99,102,241,.9);transition:transform .2s ease, box-shadow .2s ease;}
.ll-cta:hover{transform:translateY(-2px);box-shadow:0 20px 36px -10px rgba(99,102,241,1);color:#fff;}
/* 未公開状態のボタン */
.ll-cta--soon{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.22);color:#c7d2fe;
	box-shadow:none;cursor:default;}
.ll-cta-note{font-size:.75rem;line-height:1.75;color:#a5b0dd;margin:.95rem 0 0;}
/* 公開準備中バッジ */
.ll-badge{display:inline-flex;align-items:center;gap:.5rem;font-size:.6875rem;font-weight:800;letter-spacing:.14em;
	color:#fde68a;background:rgba(251,191,36,.14);border:1px solid rgba(251,191,36,.4);
	padding:.45em 1em;border-radius:100px;margin:0;}
.ll-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:#fbbf24;}
/* プレミアム関連のバッジ */
.ll-badge-tag{display:inline-flex;align-items:center;gap:.4rem;font-size:.65rem;font-weight:800;letter-spacing:.12em;
	border-radius:8px;padding:.35em .75em;margin-left:.8rem;}
.ll-badge-tag--premium{color:#f472b6;background:rgba(244,114,182,.12);border:1px solid rgba(244,114,182,.35);}
.ll-badge-tag--premium::before{content:'';width:5px;height:5px;border-radius:50%;background:#f472b6;}
.ll-badge-tag--limited{color:#60a5fa;background:rgba(96,165,250,.12);border:1px solid rgba(96,165,250,.35);}
.ll-badge-tag--limited::before{content:'';width:5px;height:5px;border-radius:50%;background:#60a5fa;}
/* アプリアイコン + 名称 */
.ll-brand{display:flex;align-items:center;gap:1.15rem;margin:0 0 1.6rem;}
.ll-brand img{flex:0 0 auto;display:block;width:78px;height:78px;border-radius:18px;
	border:1px solid rgba(255,255,255,.16);box-shadow:0 14px 26px -12px rgba(0,0,0,.8);}
.ll-brand__meta{display:flex;flex-direction:column;align-items:flex-start;gap:.55rem;min-width:0;}
.ll-brand__name{font-size:1.0625rem;font-weight:800;color:#fff;letter-spacing:.02em;}

/* ── セクション見出し ───────────────── */
.ll-head{text-align:center;max-width:40em;margin:5.5rem auto 2.75rem;}
.ll-head__label{display:block;font-size:.6875rem;font-weight:800;letter-spacing:.2em;color:#6366f1;margin:0 0 .7rem;}
.ll-head h2{font-size:1.75rem;font-weight:800;letter-spacing:-.015em;color:#0f172a;margin:0 0 .85rem;line-height:1.4;}
.ll-head p{font-size:.9375rem;line-height:1.9;color:#64748b;margin:0;}

/* ── 機能ベントー ───────────────────── */
.ll-bento{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;}
.ll-cell{position:relative;overflow:hidden;border-radius:22px;padding:2.5rem;
	border:1px solid rgba(255,255,255,.09);
	background:linear-gradient(160deg,#141235 0%,#1e1b4b 100%);
	transition:transform .25s ease, box-shadow .25s ease;}
.ll-cell::after{content:'';position:absolute;inset:0;pointer-events:none;
	background:radial-gradient(85% 55% at 50% -5%, rgba(129,140,248,.22), transparent 70%);}
.ll-cell:hover{transform:translateY(-4px);box-shadow:0 26px 44px -20px rgba(30,27,75,.75);}
.ll-cell__text{position:relative;z-index:1;min-width:0;}
.ll-cell h3{font-size:1.1875rem;font-weight:700;color:#fff;margin:0 0 .75rem;line-height:1.5;}
.ll-cell__text>p{font-size:.875rem;line-height:1.9;color:#a8b0d8;margin:0;}
.ll-list{list-style:none;margin:1.15rem 0 0;padding:0;}
.ll-list li{position:relative;padding-left:1.05rem;font-size:.8125rem;line-height:1.9;color:#b9c0e4;}
.ll-list li::before{content:'';position:absolute;left:0;top:.75em;width:5px;height:5px;border-radius:50%;background:#818cf8;}

/* セル内の複数キャプチャ */
.ll-shots{position:relative;z-index:1;display:flex;gap:1.5rem;justify-content:center;}
.ll-shots figure{flex:1 1 0;max-width:196px;margin:0;text-align:center;}
.ll-shots img{display:block;width:100%;height:auto;filter:drop-shadow(0 18px 26px rgba(0,0,0,.5));}
.ll-shots figcaption{margin-top:.85rem;font-size:.75rem;font-weight:700;color:#c7d2fe;line-height:1.6;}

/* 横並びセル（全幅） */
.ll-cell--full{grid-column:1 / -1;display:flex;align-items:center;gap:3.5rem;}
.ll-cell--full .ll-cell__text{flex:1;}
.ll-cell--full .ll-shots{flex:0 0 auto;width:430px;}
.ll-cell--rev{flex-direction:row-reverse;}
/* 縦並びセル（半幅） */
.ll-cell--half .ll-shots{margin-bottom:1.75rem;}

/* ── 操作ジェスチャー ───────────────── */
.ll-gest{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem;}
.ll-gest__item{background:#f7f8fc;border:1px solid #eceef7;border-radius:16px;padding:1.6rem 1.2rem;text-align:center;}
.ll-gest__mark{display:flex;align-items:center;justify-content:center;width:2.6rem;height:2.6rem;margin:0 auto .9rem;
	border-radius:50%;background:linear-gradient(135deg,#eef2ff,#e0e7ff);color:#4f46e5;font-size:1.05rem;font-weight:700;line-height:1;}
.ll-gest__item strong{display:block;font-size:.875rem;color:#0f172a;margin-bottom:.35rem;}
.ll-gest__item span{display:block;font-size:.75rem;line-height:1.7;color:#64748b;}

/* ── プレミアム ─────────────────────── */
.ll-prem{position:relative;overflow:hidden;border-radius:28px;padding:3.25rem 3.5rem;
	display:grid;grid-template-columns:210px minmax(0,1fr);gap:3.5rem;align-items:center;
	background:
		radial-gradient(110% 130% at 90% 8%, rgba(129,140,248,.4) 0%, rgba(129,140,248,0) 55%),
		linear-gradient(150deg,#12102e 0%,#241f5e 55%,#312e81 100%);
	box-shadow:0 30px 60px -22px rgba(49,46,129,.5);}
.ll-prem__media{position:relative;}
.ll-prem__media img{position:relative;z-index:1;display:block;width:100%;height:auto;filter:drop-shadow(0 24px 32px rgba(0,0,0,.55));}
.ll-prem__body{position:relative;z-index:1;min-width:0;}
.ll-prem h2{font-size:1.4375rem;font-weight:800;letter-spacing:-.01em;color:#fff;margin:0 0 .8rem;line-height:1.45;}
.ll-prem__body>p{font-size:.875rem;line-height:1.9;color:#cdd3f5;margin:0 0 1.7rem;max-width:44em;}
.ll-tbl-wrap{border-radius:14px;overflow:hidden;background:#1a1745;border:1px solid rgba(255,255,255,.16);}
.ll-tbl{width:100%;border-collapse:separate;border-spacing:0;background:transparent;font-size:.8438rem;margin:0;}
.ll-tbl tr{background:transparent;}
.ll-tbl th,.ll-tbl td{border:0;background:transparent;padding:.9rem 1.35rem;text-align:center;}
.ll-tbl th+th,.ll-tbl td+td{border-left:1px solid rgba(255,255,255,.14);}
.ll-tbl thead th{background:#241f5e;font-weight:700;color:#fff;border-bottom:1px solid rgba(255,255,255,.18);}
.ll-tbl thead th:first-child{background:transparent;}
.ll-tbl thead th.is-prem{background:#4b45ad;}
.ll-tbl tbody td:first-child{text-align:left;color:#f8fafc;font-weight:600;}
.ll-tbl tbody td:nth-child(2){color:#c2c9ee;}
.ll-tbl tbody tr:nth-child(even) td{background:#211d54;}
.ll-tbl tbody tr:not(:last-child) td{border-bottom:1px solid rgba(255,255,255,.13);}
.ll-tbl tbody td.is-prem{background:#443ea6;color:#fff;font-weight:700;}
.ll-tbl tbody tr:nth-child(even) td.is-prem{background:#4b45ad;}
.ll-prem__note{font-size:.75rem;line-height:1.75;color:#b3bbe8;margin:1rem 0 0;}

/* ── フッター情報 ───────────────────── */
.ll-notes{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;margin-top:5.5rem;}
.ll-note{border:1px solid #e8eaf4;background:#f7f8fc;border-radius:18px;padding:1.9rem 2rem;}
.ll-note h3{font-size:1rem;font-weight:700;color:#0f172a;margin:0 0 .7rem;}
.ll-note p{font-size:.8438rem;line-height:1.9;color:#4b5563;margin:0;}
.ll-note a{color:#4f46e5;}
.ll-contact{text-align:center;font-size:.8438rem;color:#6b7280;margin:2.5rem 0 0;}
.ll-contact a{color:#4f46e5;}

/* ── 権限一覧 ───────────────────────── */
.ll-perm{border:1px solid #e8eaf4;background:#f7f8fc;border-radius:18px;padding:1.9rem 2rem;margin-top:1.5rem;}
.ll-perm h3{font-size:1rem;font-weight:700;color:#0f172a;margin:0 0 .7rem;}
.ll-perm>p{font-size:.8438rem;line-height:1.9;color:#4b5563;margin:0;}
.ll-perm__groups{margin-top:1.5rem;display:flex;flex-direction:column;gap:1.1rem;}
.ll-perm__group{border:1px solid #e4e7f2;border-radius:12px;background:#fff;overflow:hidden;}
/* グループ見出し。権限名より一段小さく、帯で区切る */
.ll-perm__ghead{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;
	padding:.8rem 1.25rem;background:#f4f6fb;border-bottom:1px solid #e9ecf5;}
.ll-perm__ghead h4{margin:0;font-size:.8125rem;font-weight:700;color:#5a6478;letter-spacing:.01em;}
.ll-perm__group--req .ll-perm__ghead{background:#eef2ff;border-bottom-color:#dfe4ff;}
.ll-perm__group--req .ll-perm__ghead h4{color:#4338ca;}
.ll-perm__tag{display:inline-block;font-size:.65rem;font-weight:800;letter-spacing:.1em;
	border-radius:6px;padding:.24em .7em;}
.ll-perm__tag--req{color:#fff;background:#4f46e5;border:1px solid #4f46e5;}
.ll-perm__tag--opt{color:#5a6478;background:#fff;border:1px solid #d5dae8;}
.ll-perm__gnote{margin:0;padding:1rem 1.25rem;font-size:.75rem;line-height:1.9;color:#4b5563;
	background:#fbfcfe;border-bottom:1px solid #edeff6;}
/* 権限リスト */
.ll-perm__items{list-style:none;margin:0;padding:0;}
.ll-perm__items li{padding:1.15rem 1.25rem;}
.ll-perm__items li+li{border-top:1px solid #edeff6;}
.ll-perm__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.7rem;margin-bottom:.55rem;}
.ll-perm__name{font-size:.9375rem;font-weight:700;color:#0f172a;letter-spacing:.01em;}
.ll-perm__items code{font-family:"SFMono-Regular",Consolas,monospace;font-size:.6563rem;font-weight:600;
	letter-spacing:.02em;color:#4f46e5;background:#eef2ff;border:1px solid #dfe4ff;
	border-radius:6px;padding:.22em .6em;word-break:break-all;}
.ll-perm__items p{margin:0;font-size:.8125rem;line-height:1.9;color:#4b5563;}
/* 「いつ求められるか」の補足 */
.ll-perm__when{display:block;margin-top:.6rem;padding-left:.85rem;border-left:2px solid #dfe4ff;
	font-size:.75rem;line-height:1.75;color:#6b7280;}
@media (max-width:560px){
	.ll-perm__ghead{padding:.75rem 1rem;}
	.ll-perm__gnote{padding:.9rem 1rem;}
	.ll-perm__items li{padding:1rem;}
}
.ll-perm__foot{font-size:.75rem;line-height:1.8;color:#6b7280;margin:1.35rem 0 0;
	padding-top:1.1rem;border-top:1px solid #e4e7f2;}
.ll-perm__foot a{color:#4f46e5;}
@media (max-width:560px){
	.ll-perm{padding:1.5rem 1.25rem;}
}

/* ── レスポンシブ ───────────────────── */
@media (max-width:980px){
	.ll-show{grid-template-columns:1fr;gap:2.25rem;padding:2.75rem 2rem;text-align:center;}
	.ll-show__media{width:220px;margin:0 auto;}
	.ll-brand{justify-content:center;}
	.ll-show__body>p{margin-left:auto;margin-right:auto;}
	.ll-chips{justify-content:center;}
	.ll-bento{grid-template-columns:1fr;}
	.ll-cell--full,.ll-cell--rev{flex-direction:column;gap:2rem;text-align:center;}
	.ll-cell--full .ll-shots{width:100%;max-width:430px;margin:0 auto;}
	.ll-cell--full .ll-list{text-align:left;display:inline-block;}
	.ll-gest{grid-template-columns:repeat(2,1fr);}
	.ll-prem{grid-template-columns:1fr;gap:2.25rem;padding:2.5rem 2rem;text-align:center;}
	.ll-prem__media{width:170px;margin:0 auto;}
	.ll-prem__body>p{margin-left:auto;margin-right:auto;}
	.ll-tbl tbody td:first-child{text-align:left;}
	.ll-notes{grid-template-columns:1fr;}
}
@media (max-width:560px){
	.ll-show{border-radius:20px;padding:2.25rem 1.35rem;}
	.ll-show h2{font-size:1.4375rem;}
	.ll-head{margin-top:3.75rem;}
	.ll-head h2{font-size:1.375rem;}
	.ll-bento{gap:1rem;}
	.ll-cell{padding:1.6rem 1.25rem;border-radius:16px;}
	.ll-cell h3{font-size:1.0625rem;}
	.ll-shots{gap:.85rem;}
	.ll-shots figure{max-width:none;}
	.ll-shots figcaption{margin-top:.6rem;font-size:.6875rem;}
	.ll-cell--half .ll-shots{margin-bottom:1.35rem;}
	.ll-prem{border-radius:20px;padding:2rem 1.35rem;}
	.ll-tbl{font-size:.75rem;}
	.ll-tbl th,.ll-tbl td{padding:.65rem .6rem;}
	.ll-note{padding:1.5rem 1.25rem;}
}

/* ── ご利用前の注意 ───────────────────── */
.ll-caution{border:1px solid #fcd34d;background:#fffbeb;border-radius:18px;
	padding:2rem 2.25rem;margin-top:.5rem;}
.ll-caution__list{margin:0;padding:0;list-style:none;}
.ll-caution__list li{position:relative;padding-left:2.15rem;}
.ll-caution__list li+li{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid #fde68a;}
/* 2件目以降は区切りの余白分だけバッジを下げて見出しと揃える */
.ll-caution__list li+li::before{top:calc(1.5rem + .05em);}
/* 番号のバッジ */
.ll-caution__list li::before{content:counter(ll-c);counter-increment:ll-c;
	position:absolute;left:0;top:.05em;display:flex;align-items:center;justify-content:center;
	width:1.5rem;height:1.5rem;border-radius:50%;background:#f59e0b;color:#fff;
	font-size:.75rem;font-weight:800;line-height:1;}
.ll-caution__list{counter-reset:ll-c;}
.ll-caution__list strong{display:block;font-size:.9375rem;font-weight:700;color:#78350f;
	margin-bottom:.5rem;line-height:1.55;}
.ll-caution__list p{margin:0;font-size:.8438rem;line-height:1.95;color:#713f12;}
.ll-caution__list p+p{margin-top:.6rem;}
.ll-caution__list em{font-style:normal;font-weight:700;
	background:linear-gradient(transparent 62%, #fde68a 62%);}
@media (max-width:560px){
	.ll-caution{padding:1.5rem 1.25rem;}
	.ll-caution__list li{padding-left:1.9rem;}
}