/* Functional layouts absent from the static prototype. Shared visual tokens remain in lab.css. */
[hidden] { display:none !important; }
main > .section:first-child { margin-top:24px; }
.message { display:none; }
.message.show { display:block; padding:12px; border:1px solid var(--line); background:var(--green-soft); }
.message.error { background:var(--peach); }
.shell-notice:empty { display:none; }
.shell-notice { position:fixed; bottom:12px; left:16px; right:16px; z-index:40; padding:8px 10px; font-size:12px; background:var(--paper); border:1px solid var(--line); }
.form input:not([type=checkbox]):not([type=radio]), .form textarea, .form select { max-width:100%; }
.form input[type=search], .form input[type=number], .form input[type=datetime-local], .form input:not([type]) { width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:4px; background:#fff; font:inherit; }
.form-grid, .admin-row, .release-fields { display:grid; gap:10px; }
form button:not(.rt-btn):not(.btn), .admin-actions button, .detail-actions button, .comment-actions button, .gallery-comment-head button, .reaction-button { padding:8px 14px; border:1px solid var(--green); border-radius:4px; background:transparent; color:var(--green); font:inherit; font-size:13px; }
form button.primary, form button[type=submit]:not(.btn) { background:var(--green); color:var(--paper); }
form button:disabled { opacity:.45; }
.form-actions, .admin-actions, .detail-actions, .actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.filter { margin:8px 0 16px; }
.filter.form input[type=search] { font-size:15px; font-weight:400; }
.stack > * + *, .admin-list > * + * { margin-top:16px; }
.loading, .empty, .empty-state { padding:14px 16px; color:var(--muted); }
.admin-section { display:none; margin-top:32px; }
.admin-section.show { display:block; }
.thread-card { display:block; cursor:pointer; }
.thread-card h2 { font-size:inherit; margin:8px 0 0; }
.thread-image { width:56px; height:56px; object-fit:cover; margin-top:8px; }
.detail-image { max-width:100%; max-height:620px; object-fit:contain; margin-top:10px; }
.thread-detail h1, .player-title { font-family:var(--serif-jp); font-weight:500; font-size:19px; margin:12px 0 6px; }
.body-text, .comment-body { margin-top:4px; overflow-wrap:anywhere; }
.comment-head { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.comment-time { font-size:12px; color:var(--muted); }
.comment-actions { margin-left:auto; }
.comments-heading { display:flex; align-items:center; justify-content:space-between; margin:16px 0 12px; }
.comments-heading h2 { font-family:var(--serif-jp); font-size:18px; font-weight:500; }
.guide { border-bottom:1px solid var(--line); }
.guide summary { padding:14px 0; cursor:pointer; display:flex; align-items:center; gap:12px; }
.guide summary .ico { width:20px; height:20px; stroke:var(--green); fill:none; stroke-width:1.4; flex:none; }
.guide summary::after { content:'›'; margin-left:auto; color:var(--muted); }
.guide-body { padding:14px 16px; background:var(--card); }
.lesson-list { margin-top:16px; }
.lesson-list .video { width:96px; flex:none; font-size:11px; border-radius:3px; }
.player-wrap { position:relative; aspect-ratio:16/9; overflow:hidden; border-radius:6px; background:var(--green-deep); }
.player-wrap iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.lesson-article, .lesson-materials { margin-top:16px; }
.attachment-list { display:grid; gap:10px; }
.attachment-image { max-width:100%; max-height:720px; object-fit:contain; }
.pdf-link, .lesson-navigation a { display:block; padding:14px 16px; border:1px solid var(--line); border-radius:6px; }
.lesson-navigation { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:16px; }
.profile-avatar { width:56px; height:56px; font-size:24px; overflow:hidden; }
.avatar img { width:100%; height:100%; object-fit:cover; }
.profile-form { margin-top:12px; }
.profile-form label { margin-top:16px; }
.gallery-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.art-card { border:1px solid var(--line); background:var(--card); border-radius:6px; overflow:hidden; }
.image-wrap img { width:100%; aspect-ratio:1; object-fit:cover; cursor:pointer; }
.card-body { padding:14px 16px; }
.lightbox { position:fixed; inset:0; background:rgba(20,30,25,.45); z-index:50; overflow:auto; padding:16px; }
.lightbox:not(.show) { display:none; }
.lightbox-panel { max-width:720px; margin:auto; padding:16px; background:var(--card); }
.lightbox img { max-height:60vh; margin:auto; object-fit:contain; }
.reaction-list { display:flex; flex-wrap:wrap; gap:6px; }
.reaction-button.selected { background:var(--green-soft); }
body.lightbox-open { overflow:hidden; }
.announcement-summary { display:flex; align-items:center; gap:12px; cursor:pointer; list-style:none; }
.announcement-summary .chev { margin-left:auto; color:var(--muted); }
.notification-card { display:block; }
.research-author { display:flex; gap:10px; align-items:center; }
.rt-content .rt-p { font-weight:400; margin:4px 0 0; }
.rt-content { line-height:1.7; font-size:14px; }

.thread-card .badge { font-weight:400; }
/* P4 functional controls; prototype dimensions and tokens retained. */
.stamp-header { display:flex; justify-content:space-between; align-items:baseline; }
.stamp-header .title { margin:0; }
.stamp-count { font-family:var(--serif-en); font-size:18px; color:var(--green); }
#stamp-card > .meta { margin-top:10px; }
.steps button.box { padding:0; cursor:pointer; font:inherit; background:transparent; }
.photos > img,.work-photo img { width:100%; aspect-ratio:1; object-fit:cover; border-radius:3px; }
.photos .work-photo { margin:0; min-width:0; }
.work-photo figcaption { display:flex; flex-wrap:wrap; gap:2px; }
.work-photo .btn { padding:3px; font-size:11px; }
.work-message { white-space:pre-wrap; overflow-wrap:anywhere; }
.library-thumb { width:96px; flex:none; aspect-ratio:16/9; font-size:11px; border-radius:3px; }
.library-info { flex:1; min-width:0; }
.library-info .progress { margin-top:8px; }
.video-heading { font-family:var(--serif-jp); font-weight:500; margin:12px 0 4px; }
.chapter-link { border:0; padding:0; background:transparent; font:inherit; color:inherit; text-align:left; cursor:pointer; }
.chapter-row > button:last-child { grid-column:1 / -1; justify-self:start; }

/* P5: prototype step check size. */
.steps button.box { font-size:12px; }

#board .photos .add button { all:unset; cursor:pointer; width:100%; height:100%; text-align:center; }

/* P5b: full-size review photos, one column on phones. */
.sheet-photos { display:grid; grid-template-columns:1fr; gap:10px; margin:12px 0; }
.sheet-photos img { width:100%; height:auto; }
@media (min-width:640px) {
  .sheet-photos { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

.ops-form input[type=email], .ops-form input[type=url], .ops-form input[type=date] {
  width:100%; padding:11px 12px; border:1px solid var(--line); border-radius:4px; background:#fff; font:inherit;
}
