.onboarding{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:12px;background:rgba(23,59,50,.86)}
.onboarding-panel{width:min(100%,440px);max-height:calc(100dvh - 24px);overflow:auto;background:var(--paper);border:1px solid #c9cec0;border-radius:8px;padding:18px;box-shadow:0 18px 60px #10271f40;outline:none}
.onboarding-top{display:flex;align-items:center;justify-content:space-between;gap:16px}.onboarding-top .eyebrow{color:var(--muted)}.onboarding-skip{min-width:44px;min-height:44px;background:transparent;padding:0 4px;text-decoration:underline;text-underline-offset:5px;text-decoration-color:#a6afa0}
.onboarding-copy{margin:12px 0 18px}.onboarding-copy h2{font-size:26px;line-height:1.45;letter-spacing:.04em}.onboarding-copy>p{margin-top:8px;line-height:1.8;color:var(--muted)}
.onboarding-content{min-height:285px}.onboarding-content label{display:block;margin-bottom:7px;font-weight:700}.onboarding-content input,.onboarding-content textarea{width:100%;font:inherit;background:#fffdf6;border:1px solid #aab1a4;border-radius:4px;padding:12px}.onboarding-content textarea{resize:vertical}.onboarding-search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.onboarding-search-row .button{min-width:70px;padding-inline:14px}
.onboarding-content .search-fields label{display:flex;align-items:center;gap:7px;min-height:44px;margin-bottom:0;font-size:13px;font-weight:400}.onboarding-content .search-fields input{width:18px;height:18px;padding:0}
.onboarding-results{display:grid;gap:8px;max-height:190px;overflow:auto;margin-top:14px}.onboarding-results>p{padding:18px;background:#e8eadf;color:var(--muted);line-height:1.7}.onboarding-result{display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:12px;min-height:68px;width:100%;padding:8px;text-align:left;background:#fffdf6;border:1px solid var(--line);border-radius:4px}.onboarding-result:hover,.onboarding-result:focus-visible{border-color:var(--green);background:#f3f2e9}.onboarding-result strong,.onboarding-result small,.onboarding-book-card strong,.onboarding-book-card small{display:block;overflow:hidden;text-overflow:ellipsis}.onboarding-result small,.onboarding-book-card small{margin-top:5px;color:var(--muted)}
.onboarding-cover{display:grid;place-items:center;width:48px;height:58px;overflow:hidden;background:var(--green);color:#f4dfaa;font-family:var(--serif);border:2px solid #d5b783}.onboarding-cover img{width:100%;height:100%;object-fit:cover}.onboarding-later{min-height:44px;margin-top:10px}.onboarding-book-card{display:grid;grid-template-columns:76px minmax(0,1fr);align-items:center;gap:18px;padding:18px;background:#e8eadf;border:1px solid var(--line)}.onboarding-book-card .onboarding-cover{width:76px;height:104px}.onboarding-book-card strong{font-family:var(--serif);font-size:20px;line-height:1.5}.onboarding-wide{width:100%;min-height:48px;margin-top:16px}.onboarding-count{text-align:right;color:var(--muted);font-size:12px}.onboarding-shelf-preview{position:relative;padding:12px 12px 28px;background:#76583e;border:7px solid #60462f}.onboarding-shelf-preview .onboarding-book-card{background:#e6dcc5}.onboarding-shelf-preview>span{position:absolute;right:10px;bottom:5px;color:#f5e9c9;font-size:11px}
.onboarding-browser-warning{display:grid;gap:12px;margin-top:16px}.onboarding-browser-warning .notice{margin-top:0}.onboarding-browser-warning .button{width:100%;min-height:44px}.onboarding-browser-warning .search-label{margin:0}
.onboarding-progress{display:flex;align-items:center;gap:7px;margin:14px 0 10px;color:var(--muted);font-size:12px}.onboarding-progress i{display:block;width:22px;height:2px;background:#c7ccbf}.onboarding-progress i[aria-current]{height:4px;background:var(--green)}.onboarding-position{margin-left:auto;font-variant-numeric:tabular-nums}.onboarding-actions{min-height:44px}.onboarding-actions .button{min-height:44px}.section-name-placeholder{color:var(--muted);font-weight:400}.first-book-guide{padding:9px 13px!important;background:#f4dfaa!important;color:#173b32!important;border-radius:4px;font-family:var(--serif);box-shadow:0 4px 20px #0005}
body[data-capture-ui="hidden"] #app,body[data-capture-ui="hidden"] .skip-link,body[data-capture-ui="hidden"] #toast{visibility:hidden}.onboarding:not([hidden]){visibility:visible!important}
@media(min-width:680px){.onboarding{padding:24px}.onboarding-panel{width:min(88vw,720px);padding:28px}.onboarding-copy h2{font-size:32px}.onboarding-content{min-height:310px}.onboarding-results{grid-template-columns:1fr 1fr;max-height:220px}.onboarding-book-card{grid-template-columns:96px minmax(0,1fr)}.onboarding-book-card .onboarding-cover{width:96px;height:132px}}

/* 各操作の意味を先に伝える、同一画材の生成イラストです。 */
.onboarding-visual{height:136px;margin:8px 0 14px;overflow:hidden;background:#dfe5d8;border:1px solid var(--line)}
.onboarding-visual img{width:100%;height:100%;object-fit:cover;object-position:center}
@media(min-width:680px){.onboarding-visual{height:190px;margin-top:10px}}