/* 作成者: 浦野一輝 / 作成日時: 2026-10-27 14:16 JST / 説明: スマホ・PC向けのプロンプト配布ページ */
:root{color-scheme:light;--ink:#333;--muted:#707070;--accent:#a51e6d;--pale:#f6e9f0;--line:#ebebeb;--font:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:#fdfcfd;color:var(--ink);font-family:var(--font);font-size:20px;line-height:1.65;-webkit-text-size-adjust:100%}.wrap{width:min(1040px,calc(100% - 64px));margin-inline:auto}button,a,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{cursor:wait}a{color:var(--accent);text-underline-offset:5px}button:focus-visible,a:focus-visible,summary:focus-visible,textarea:focus-visible{outline:3px solid var(--accent);outline-offset:5px}button[hidden],[hidden]{display:none!important}.hero{padding:32px 0 40px;text-align:center}.cover-title{margin:0 0 28px;line-height:1}.hero-cover{display:block;width:100%;height:auto;border-radius:16px}h1{font-size:48px;line-height:1.45;letter-spacing:-.035em;font-weight:800;margin:0 0 28px}h1>span{color:var(--accent)}.copy-button{min-height:64px;border:0;border-radius:12px;padding:18px 28px;display:inline-flex;align-items:center;justify-content:center;gap:12px;background:var(--accent);color:#fff;font-weight:600;font-size:20px;box-shadow:0 6px 16px #a51e6d18;transition:background .15s,transform .15s}.copy-button:hover{background:#8c195c}.copy-button:active{transform:translateY(1px)}.copy-button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;flex-shrink:0}.copy-note{font-size:20px;color:var(--muted);margin:16px 0 0}.how-to{padding:40px;border-radius:20px;background:#fff;border:1px solid var(--line)}.section-heading{margin:0 0 28px}.small-label{font-family:"Avenir Next Arabic","Avenir Next",var(--font);display:block;font-size:20px;color:var(--muted);font-weight:500;letter-spacing:.08em}h2{font-size:28px;font-weight:600;margin:6px 0 0;line-height:1.4}.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:0;margin:0;gap:32px;list-style:none}.step-number{font-size:32px;line-height:1.4;color:#d28fb6;font-weight:400;display:block;margin-bottom:12px}h3{font-size:20px;font-weight:500;margin:0 0 10px}.steps p{color:#5c5c5c;font-size:20px;line-height:1.65;margin:0}.prompt-section{margin-top:40px}details{border:1px solid #e4dbe0;border-radius:16px;background:#fff;overflow:hidden}summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:28px 32px;cursor:pointer}summary::-webkit-details-marker{display:none}.summary-title{display:block;font-size:24px;font-weight:500;margin-top:4px}.expand{color:var(--accent);font-size:32px;flex-shrink:0}details[open] .expand{transform:rotate(45deg)}.prompt-body{padding:32px;border-top:1px solid var(--line);background:#faf9fa}pre{font-family:var(--font);font-size:20px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.85;margin:0;user-select:text}.secondary-actions{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:14px;font-size:20px}.secondary-actions a,.text-button{display:inline-flex;align-items:center;min-height:48px;padding:8px 0}.text-button{border:0;background:none;color:var(--accent);text-decoration:underline;text-underline-offset:5px}.disclaimer{font-size:20px;color:var(--muted);margin:48px 0 0}.footer{margin-top:40px;border-top:1px solid var(--line);padding-block:28px;display:flex;justify-content:space-between;gap:16px;color:var(--muted);font-size:20px}#toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%,12px);width:max-content;max-width:calc(100% - 32px);padding:14px 22px;border-radius:12px;background:#333;color:white;box-shadow:0 6px 24px #0002;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:20;font-size:20px}#toast.visible{opacity:1;transform:translate(-50%,0)}dialog{width:min(640px,calc(100% - 32px));max-height:calc(100dvh - 40px);overflow:auto;border:1px solid var(--line);border-radius:20px;padding:28px;color:var(--ink);background:#fff}dialog::backdrop{background:#2228}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.dialog-heading h2{font-size:24px}.dialog-heading button{border:0;background:#f6e9f0;color:var(--accent);border-radius:50%;width:48px;height:48px;font-size:28px;flex-shrink:0}dialog p,dialog label{font-size:20px}dialog textarea{width:100%;height:220px;padding:16px;font:20px/1.6 var(--font);border:1px solid #c2c2c2;border-radius:10px;resize:vertical;margin:8px 0 20px}dialog .copy-button{width:100%}.skip-link{position:fixed;top:0;left:16px;padding:8px 16px;background:white;z-index:50;transform:translateY(-120%)}.skip-link:focus{transform:translateY(0)}
@media(max-width:760px){.wrap{width:calc(100% - 40px)}.hero{padding:20px 0 32px}.cover-title{margin-bottom:24px}.hero-cover{border-radius:12px}h1{font-size:32px;line-height:1.5;margin-bottom:24px}.primary-copy{width:100%;padding-inline:12px}.copy-note{line-height:1.6}.how-to{padding:28px 24px}h2{font-size:24px}.steps{grid-template-columns:1fr;gap:24px}.steps li{display:flex;align-items:flex-start;gap:18px}.step-number{font-size:28px;margin:0;min-width:38px;line-height:1.5}.steps li+li{border-top:1px solid var(--line);padding-top:24px}.prompt-section{margin-top:28px}summary{padding:24px 20px}.summary-title{font-size:20px}.prompt-body{padding:24px 20px}.secondary-actions{gap:4px;flex-direction:column}.disclaimer{margin-top:28px}.footer{flex-direction:column;gap:4px;margin-top:28px;padding-bottom:calc(28px + env(safe-area-inset-bottom))}#toast{bottom:calc(24px + env(safe-area-inset-bottom));text-align:center}dialog{padding:24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}