/* ============================================================================
 * /host/poster-sheet.css — ポータルの印刷タブ (2026-10-05)
 *   紙面そのものは poster-sheet.js が canvas に描く (RESTO-PAAN の案内カードと同じ作り)。 ここは画面の見た目だけ。
 * ========================================================================== */
.ps-panel{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:12px}
@media (max-width:1100px){ .ps-panel{grid-template-columns:1fr 1fr} }
@media (max-width:720px){ .ps-panel{grid-template-columns:1fr} }
.ps-panel .rep-card{padding:24px;gap:14px}
.ps-panel .rep-card h3{font-size:19px}
.ps-panel .rep-card p{font-size:14.5px}
.ps-panel .rep-card .rep-btn{font-size:17px;padding:14px 18px}
.ps-thumb{display:block;margin:4px auto 0;height:180px;width:auto}
.ps-codehead{grid-column:1/-1;font-size:16px;font-weight:600;color:var(--mp-primary-deep)}
/* 刷るコードの札 (押して選ぶ) */
.ps-codes{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.ps-code{font:inherit;text-align:left;cursor:pointer;background:var(--mp-surface);border:2px solid var(--mp-border);border-radius:var(--r);padding:18px 20px;display:flex;flex-direction:column;gap:6px;color:var(--mp-text)}
.ps-code:hover{border-color:var(--mp-primary)}
.ps-code.on{border-color:var(--mp-primary);background:var(--mp-primary-tint);box-shadow:0 0 0 1px var(--mp-primary) inset}
.ps-code-v{font-size:28px;font-weight:700;letter-spacing:.08em;color:var(--mp-primary-deep);font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.ps-code-l{font-size:15px;font-weight:600;color:var(--mp-text)}
.ps-code-d{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:6px 0 0;font-size:14px;line-height:1.6}
.ps-code-d dt{color:var(--mp-text-soft)}
.ps-code-d dd{margin:0;color:var(--mp-text)}
.ps-msg{grid-column:1/-1;font-size:14px;color:var(--mp-text-soft);line-height:1.7}