:root {
  --bg: #eef7ff;
  --bg2: #fff7ed;
  --card: rgba(255, 255, 255, .86);
  --line: rgba(15, 23, 42, .12);
  --text: #102033;
  --muted: #64748b;
  --primary: #0ea5e9;
  --primary2: #f97316;
  --danger: #dc2626;
  --success: #16a34a;
  --shadow: 0 20px 60px rgba(14, 116, 144, .14);
  --radius: 22px;
}
* { box-sizing: border-box; }
html { min-height: 100%; background: radial-gradient(circle at top left, #dff7ff 0, transparent 34%), radial-gradient(circle at top right, #ffedd5 0, transparent 30%), var(--bg); }
body { margin: 0; color: var(--text); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", sans-serif; line-height: 1.75; }
a { color: #0284c7; text-decoration: none; }
a:hover { text-decoration: underline; }
button, .button { border: 1px solid var(--line); background: white; color: var(--text); border-radius: 999px; padding: .65rem 1rem; font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; gap: .35rem; text-decoration: none; }
button:hover, .button:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(15, 23, 42, .12); text-decoration: none; }
button.primary, .button.primary, .nav-cta { background: linear-gradient(135deg, var(--primary), #38bdf8); border: 0; color: white; box-shadow: 0 12px 28px rgba(14, 165, 233, .28); }
button.small, .button.small { padding: .35rem .7rem; font-size: .85rem; }
button.danger, .danger { color: var(--danger); }
.site-shell { width: min(1180px, calc(100% - 28px)); margin: 0 auto; }
.site-header { position: sticky; top: 10px; z-index: 20; margin: 14px 0 26px; padding: 12px; border: 1px solid rgba(255,255,255,.72); border-radius: 26px; background: rgba(255,255,255,.78); backdrop-filter: blur(16px); box-shadow: var(--shadow); display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--text); min-width: 240px; }
.brand:hover { text-decoration: none; }
.brand-mark { width: 46px; height: 46px; border-radius: 16px; background: linear-gradient(135deg, #0ea5e9, #f97316); color: white; display: grid; place-items: center; font-weight: 900; font-size: 1.5rem; }
.brand small { display: block; color: var(--muted); font-size: .78rem; line-height: 1.2; }
.top-nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
.top-nav a { padding: .55rem .8rem; border-radius: 999px; color: var(--text); font-weight: 700; }
.top-nav a:hover { background: rgba(14, 165, 233, .1); text-decoration: none; }
.nav-badge { display: inline-flex; margin-left: .25rem; min-width: 1.3rem; height: 1.3rem; border-radius: 999px; align-items: center; justify-content: center; background: #ef4444; color: white; font-size: .75rem; }
.nav-toggle { display: none; }
.main { min-height: 68vh; }
.hero { display: grid; grid-template-columns: 1fr 270px; gap: 18px; align-items: stretch; margin-bottom: 22px; }
.hero > div:first-child, .hero-card { border: 1px solid rgba(255,255,255,.75); background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(240,249,255,.82)); border-radius: 32px; padding: clamp(22px, 4vw, 42px); box-shadow: var(--shadow); }
.hero h1 { margin: 0 0 10px; font-size: clamp(2rem, 5vw, 4rem); line-height: 1.08; letter-spacing: -.05em; }
.eyebrow { margin: 0 0 8px; color: var(--primary2); font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.hero-card { display: grid; place-content: center; text-align: center; }
.hero-card strong { display: block; font-size: 2.6rem; line-height: 1; color: var(--primary); }
.hero-card span { margin-bottom: 20px; color: var(--muted); font-weight: 700; }
.card { border: 1px solid rgba(255,255,255,.76); background: var(--card); border-radius: var(--radius); padding: 20px; box-shadow: 0 12px 36px rgba(15, 23, 42, .08); backdrop-filter: blur(12px); }
.grid { display: grid; gap: 18px; }
.grid.two { grid-template-columns: minmax(0, 1fr) 350px; align-items: start; }
.section-head { display: flex; justify-content: space-between; align-items: end; gap: 12px; margin: 24px 0 12px; }
.section-head h1, .section-head h2 { margin: 0; line-height: 1.2; }
.section-head p { margin: 0; color: var(--muted); }
.form-card { max-width: 560px; margin: 0 auto; }
form label { display: block; font-weight: 800; margin: .7rem 0; }
input, textarea, select { width: 100%; border: 1px solid var(--line); border-radius: 16px; padding: .8rem .9rem; font: inherit; background: rgba(255,255,255,.88); color: var(--text); }
textarea { resize: vertical; }
label small, .muted { color: var(--muted); }
.check { display: flex; gap: .5rem; align-items: center; }
.check input { width: auto; }
.post-form { margin-bottom: 18px; }
.post-kind { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 12px; }
.post-kind label { margin: 0; display: inline-flex; gap: .35rem; align-items: center; }
.post-kind input[type=radio] { width: auto; }
.post-kind select { width: auto; min-width: 140px; margin-left: auto; }
.diary-title { margin-bottom: 10px; }
.form-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 8px; }
.post-card { margin-bottom: 14px; }
.post-meta { display: flex; align-items: center; gap: 10px; }
.post-meta small { display: block; color: var(--muted); line-height: 1.3; }
.avatar { width: var(--avatar-size); height: var(--avatar-size); min-width: var(--avatar-size); border-radius: 40%; display: inline-grid; place-items: center; color: white; background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.45), transparent 26%), var(--avatar-color); font-weight: 900; box-shadow: inset 0 0 0 2px rgba(255,255,255,.46), 0 8px 20px rgba(15,23,42,.12); vertical-align: middle; }
.user-link { font-weight: 900; color: var(--text); }
.pill { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; padding: .25rem .65rem; background: #e0f2fe; color: #0369a1; font-size: .82rem; font-weight: 900; margin-left: auto; }
.pill.success { background: #dcfce7; color: #15803d; }
.post-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; color: var(--muted); font-weight: 700; border-top: 1px solid var(--line); padding-top: 12px; margin-top: 12px; }
.link-button { border: 0; background: transparent; padding: 0; color: #0284c7; box-shadow: none !important; }
.body-text { font-size: 1.04rem; }
.comment, .community-post { display: flex; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.comment small, .community-post small { display: block; color: var(--muted); }
.inline-form { display: grid; gap: 10px; margin-top: 12px; }
.inline-form.compact { grid-template-columns: 1fr auto; align-items: end; }
.profile-hero { display: flex; gap: 18px; align-items: flex-start; margin-bottom: 18px; }
.profile-hero h1 { margin: 0; font-size: 2.1rem; }
.actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.mini-user, .request-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.mini-user small, .request-row small { display: block; color: var(--muted); }
.community-chip { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; padding: .35rem .7rem; margin: 4px; background: #fff; font-weight: 800; color: var(--text); }
.member-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
.member-card { text-align: center; }
.member-card h3 { margin: .5rem 0 0; }
.search-form { display: flex; gap: 8px; }
.search-form input { min-width: 220px; }
.community-card { margin-bottom: 14px; }
.community-head { margin-bottom: 16px; }
.message-thread { display: grid; gap: 10px; max-height: 520px; overflow: auto; padding: 10px; background: rgba(224,242,254,.45); border-radius: 18px; }
.message { max-width: 76%; padding: 10px 12px; border-radius: 18px 18px 18px 6px; background: white; border: 1px solid var(--line); }
.message.mine { margin-left: auto; border-radius: 18px 18px 6px 18px; background: #dff6ff; }
.message p { margin: 0; }
.message small { color: var(--muted); }
.thread-link { display: flex; gap: 10px; align-items: center; padding: 10px; border-radius: 16px; color: var(--text); }
.thread-link:hover { background: #f0f9ff; text-decoration: none; }
.thread-link span { flex: 1; font-weight: 900; }
.thread-link small { display: block; color: var(--muted); font-weight: 500; }
.thread-link b { background: #ef4444; color: #fff; border-radius: 999px; min-width: 1.5rem; height: 1.5rem; display: inline-grid; place-items: center; }
.admin-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 18px; }
.admin-menu { display: grid; gap: 8px; align-self: start; }
.admin-menu a { padding: .7rem .8rem; border-radius: 14px; color: var(--text); font-weight: 900; }
.admin-menu a:hover { background: #f0f9ff; text-decoration: none; }
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.stats div { border: 1px solid var(--line); border-radius: 18px; padding: 16px; background: rgba(255,255,255,.72); }
.stats strong { display: block; font-size: 2rem; color: var(--primary); line-height: 1; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 680px; }
th, td { border-bottom: 1px solid var(--line); text-align: left; padding: 10px; vertical-align: top; }
th { color: var(--muted); font-size: .9rem; }
.table-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.flash { padding: 12px 16px; border-radius: 16px; margin: 0 0 14px; font-weight: 800; background: #dcfce7; color: #166534; border: 1px solid rgba(22, 163, 74, .22); }
.flash.error { background: #fee2e2; color: #991b1b; border-color: rgba(220, 38, 38, .2); }
.empty { color: var(--muted); text-align: center; padding: 28px; }
.check-list { padding-left: 1.2rem; }
.check-list li { margin: .35rem 0; }
.site-footer { margin: 36px 0 18px; display: flex; align-items: center; justify-content: center; gap: 14px; color: var(--muted); flex-wrap: wrap; }
code { background: #f1f5f9; padding: .2rem .45rem; border-radius: 8px; color: #0f172a; }
@media (max-width: 860px) {
  .site-shell { width: min(100% - 20px, 1180px); }
  .site-header { align-items: flex-start; flex-wrap: wrap; top: 6px; }
  .brand { min-width: 0; flex: 1; }
  .nav-toggle { display: inline-flex; }
  .top-nav { display: none; width: 100%; justify-content: flex-start; border-top: 1px solid var(--line); padding-top: 10px; }
  .top-nav.open { display: flex; }
  .hero, .grid.two, .admin-layout { grid-template-columns: 1fr; }
  .hero-card { grid-template-columns: 1fr 1fr; }
  .post-kind select { margin-left: 0; width: 100%; }
  .section-head { align-items: stretch; flex-direction: column; }
  .search-form { flex-direction: column; }
  .profile-hero { flex-direction: column; }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .message { max-width: 90%; }
}
@media (max-width: 520px) {
  .top-nav a { width: calc(50% - 4px); text-align: center; }
  .hero > div:first-child, .hero-card, .card { border-radius: 20px; padding: 16px; }
  .hero h1 { font-size: 2rem; }
  .stats { grid-template-columns: 1fr; }
  .inline-form.compact { grid-template-columns: 1fr; }
}

/* v1.1 SNS拡張 */
.avatar-photo { overflow: hidden; padding: 0; background: #e0f2fe; }
.avatar-photo .avatar-img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; display: block; }
.diary-extra { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.upload-hint small { display: block; margin-top: .25rem; }
.category-pill { display: inline-flex; margin-top: 10px; border-radius: 999px; padding: .25rem .65rem; background: #fff7ed; color: #c2410c; font-weight: 900; font-size: .82rem; }
.notice-line { border: 1px solid rgba(249,115,22,.22); background: #fff7ed; color: #9a3412; border-radius: 14px; padding: .65rem .8rem; font-weight: 800; }
.short-status { display: inline-flex; border-radius: 999px; padding: .4rem .8rem; background: #e0f2fe; color: #0369a1; font-weight: 900; }
.post-thumb, .post-image, .comment-image, .message-image, .community-thumb, .community-image, .album-image { display: block; width: 100%; object-fit: cover; border-radius: 18px; border: 1px solid var(--line); background: #f8fafc; }
.post-thumb { max-height: 230px; margin: 12px 0; }
.post-image { max-height: 620px; margin: 16px 0; }
.comment-image, .message-image { max-width: 360px; max-height: 260px; margin-top: 8px; }
.community-thumb { height: 150px; margin-bottom: 12px; }
.community-image { max-height: 320px; margin-bottom: 16px; }
.reaction-row { display: flex; flex-wrap: wrap; gap: 8px; border-top: 1px solid var(--line); padding-top: 14px; margin-top: 16px; }
.reaction-row form { margin: 0; }
.reaction-button { padding: .45rem .75rem; font-size: .9rem; border-color: rgba(14,165,233,.2); background: rgba(240,249,255,.9); }
.reaction-button.active { background: linear-gradient(135deg, #0ea5e9, #38bdf8); color: #fff; border-color: transparent; }
.reaction-button.readonly { display: inline-flex; cursor: default; }
.reaction-button b { margin-left: .25rem; }
.profile-list { margin: 0; display: grid; gap: 8px; }
.profile-list dt { color: var(--muted); font-size: .86rem; font-weight: 900; }
.profile-list dd { margin: 0 0 6px; padding-bottom: 8px; border-bottom: 1px dashed var(--line); }
.stats.mini { grid-template-columns: 1fr 1fr; margin-bottom: 12px; }
.notification-item { display: flex; gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.notification-item.unread { background: rgba(224,242,254,.55); margin: 0 -10px; padding: 14px 10px; border-radius: 16px; }
.notification-item small { display: block; color: var(--muted); }
.notification-item p { margin: .25rem 0 .5rem; }
.intro-item { display: flex; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.intro-item.pending { background: rgba(255,247,237,.75); border-radius: 14px; padding: 12px; }
.album-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; }
.album-item { margin: 0; padding: 12px; }
.album-image { aspect-ratio: 1 / 1; }
.album-item figcaption { margin-top: 8px; color: var(--muted); font-size: .9rem; }
.admin-panel h2 { margin-top: 1.5rem; }
@media (max-width: 860px) {
  .diary-extra { grid-template-columns: 1fr; }
  .comment-image, .message-image { max-width: 100%; }
  .notification-item, .intro-item { align-items: flex-start; }
}

/* v1.2 懐かしSNS風大規模化 */
.notice-stack { display: grid; gap: 12px; margin: 0 0 18px; }
.official-notice { border: 1px solid rgba(14,165,233,.18); background: linear-gradient(135deg, rgba(255,255,255,.94), rgba(240,249,255,.86)); border-radius: 22px; padding: 16px 18px; box-shadow: 0 14px 32px rgba(14,116,144,.10); }
.official-notice span { display: inline-flex; border-radius: 999px; padding: .18rem .6rem; background: #e0f2fe; color: #0369a1; font-weight: 900; font-size: .82rem; }
.official-notice h2, .official-notice h3 { margin: .4rem 0 .25rem; }
.official-notice.type-important, .official-notice.type-warning { border-color: rgba(249,115,22,.35); background: linear-gradient(135deg, rgba(255,247,237,.96), rgba(255,255,255,.88)); }
.official-notice.type-maintenance, .official-notice.type-bug { border-color: rgba(220,38,38,.25); background: linear-gradient(135deg, rgba(254,242,242,.96), rgba(255,255,255,.88)); }
.filter-bar, .search-advanced { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; align-items: end; margin-bottom: 16px; }
.search-advanced .check, .filter-bar .check { align-self: center; }
.rich-form { background: linear-gradient(145deg, rgba(255,255,255,.92), rgba(240,249,255,.78)); border-color: rgba(14,165,233,.16); }
.community-scope { border: 1px dashed rgba(14,165,233,.35); border-radius: 18px; padding: 10px 12px; background: rgba(240,249,255,.55); }
.tag-row { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.tag-chip { display: inline-flex; align-items: center; border-radius: 999px; padding: .25rem .65rem; background: rgba(14,165,233,.10); color: #0369a1; font-weight: 900; font-size: .85rem; }
.recommended-card { position: relative; border-color: rgba(249,115,22,.36); background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(255,247,237,.76)); }
.recommend-ribbon { display: inline-flex; margin: 10px 0; border-radius: 999px; padding: .25rem .7rem; background: linear-gradient(135deg, #f97316, #facc15); color: #fff; font-weight: 900; box-shadow: 0 10px 22px rgba(249,115,22,.22); }
.friend-request-box { display: inline-block; }
.friend-request-box summary { list-style: none; }
.friend-request-box summary::-webkit-details-marker { display: none; }
.friend-row { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }
.friend-row small { display: block; color: var(--muted); }
.community-title-row { display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.rules-box { margin: 14px 0; border: 1px dashed rgba(14,165,233,.32); border-radius: 18px; background: rgba(240,249,255,.62); padding: 14px; }
.rules-box h3 { margin: 0 0 6px; }
.topic-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 12px; border: 1px solid var(--line); border-radius: 18px; margin-bottom: 10px; background: rgba(255,255,255,.72); }
.topic-row.active { border-color: rgba(14,165,233,.35); background: rgba(224,242,254,.65); }
.topic-row small { display: block; color: var(--muted); }
.topic-flags { display: flex; gap: 6px; flex-wrap: wrap; }
.topic-detail { margin-top: 16px; border-color: rgba(14,165,233,.25); }
.event-card, .baton-card { margin-bottom: 14px; }
.event-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.event-row small { display: block; color: var(--muted); }
.event-detail h1 { margin-top: .4rem; }
.ranking-row { display: grid; grid-template-columns: 32px auto 1fr auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); }
.ranking-row b { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 12px; background: linear-gradient(135deg, #0ea5e9, #38bdf8); color: #fff; }
.ranking-row em { font-style: normal; color: var(--primary2); font-weight: 900; }
.ranking-row small { display: block; color: var(--muted); }
.baton-answer { display: flex; gap: 12px; border-bottom: 1px solid var(--line); padding: 14px 0; }
.baton-answer p { margin: .55rem 0; }
@media (max-width: 760px) {
  .friend-row { grid-template-columns: auto 1fr; }
  .friend-row .actions { grid-column: 1 / -1; }
  .topic-row { grid-template-columns: 1fr; }
  .ranking-row { grid-template-columns: 28px auto 1fr; }
  .ranking-row em { grid-column: 3; }
}

/* v1.3 ソレミ：プロフィール装飾・マイページ部屋・招待 */
.profile-hero { position: relative; overflow: hidden; background: linear-gradient(135deg, color-mix(in srgb, var(--profile-bg, #eef7ff) 72%, white), rgba(255,255,255,.9)); border-color: rgba(14,165,233,.18); }
.profile-cover { grid-column: 1 / -1; width: calc(100% + 40px); margin: -20px -20px 10px; max-height: 220px; overflow: hidden; border-radius: var(--radius) var(--radius) 18px 18px; }
.profile-cover-img { width: 100%; height: 220px; object-fit: cover; border: 0; border-radius: 0; }
.profile-theme-night { background: linear-gradient(135deg, #172554, #0f172a) !important; color: #e0f2fe; }
.profile-theme-night .muted, .profile-theme-night a { color: #bae6fd; }
.profile-theme-sakura { background: linear-gradient(135deg, #fff1f2, #fdf2f8) !important; }
.profile-theme-forest { background: linear-gradient(135deg, #ecfdf5, #f0fdf4) !important; }
.profile-theme-game { background: linear-gradient(135deg, #eff6ff, #f5f3ff) !important; }
.profile-theme-retro { background: linear-gradient(135deg, #fef3c7, #fffbeb) !important; }
.profile-title { display: inline-flex; margin: .2rem 0 .45rem; border-radius: 999px; padding: .35rem .8rem; background: linear-gradient(135deg, #f97316, #facc15); color: white; font-weight: 900; box-shadow: 0 10px 24px rgba(249,115,22,.2); }
.bgm-label { display: inline-flex; border: 1px solid rgba(14,165,233,.22); border-radius: 999px; padding: .3rem .75rem; background: rgba(240,249,255,.72); color: #0369a1; font-weight: 900; }
.badge-row { display: flex; flex-wrap: wrap; gap: 6px; margin: .4rem 0; }
.badge-chip { display: inline-flex; border-radius: 999px; padding: .24rem .65rem; background: rgba(255,255,255,.75); border: 1px solid var(--line); font-weight: 900; font-size: .86rem; }
.mood-chip { display: inline-flex; margin: 10px 6px 4px 0; border-radius: 999px; padding: .25rem .72rem; background: linear-gradient(135deg, #f0f9ff, #fff7ed); border: 1px solid rgba(14,165,233,.18); color: #0369a1; font-weight: 900; font-size: .86rem; }
.mypage-room { margin: 18px 0; background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(240,249,255,.74)); }
.room-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; }
.room-block { border: 1px solid rgba(14,165,233,.12); border-radius: 18px; padding: 14px; background: rgba(255,255,255,.74); box-shadow: inset 0 1px 0 rgba(255,255,255,.7); }
.room-block h3 { margin: 0 0 8px; font-size: 1rem; }
.room-profile-image { text-align: center; }
.pinned-post { margin: 18px 0; }
.edit-section { border: 1px dashed rgba(14,165,233,.28); border-radius: 18px; padding: 14px; margin: 16px 0; background: rgba(240,249,255,.48); }
.edit-section h2 { margin-top: 0; }
.checkbox-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 6px 12px; }
.recommend-members { margin: 16px 0; }
.community-invite-box { border-color: rgba(249,115,22,.22); background: linear-gradient(135deg, rgba(255,255,255,.95), rgba(255,247,237,.72)); }
.invite-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.invite-row small { display: block; color: var(--muted); }
.invite-row input { margin-top: 6px; }
.invite-received { border: 1px solid rgba(14,165,233,.18); border-radius: 16px; padding: 12px; background: rgba(240,249,255,.6); margin-bottom: 10px; }
@media (max-width: 760px) {
  .profile-cover { width: calc(100% + 32px); margin: -16px -16px 10px; }
  .invite-row { grid-template-columns: auto 1fr; }
  .invite-row button { grid-column: 1 / -1; justify-content: center; }
}

/* v1.4 ソレミ：ゲーム連携・認証・通報 */
.game-profile-edit { border: 1px solid rgba(14,165,233,.18); border-radius: 18px; padding: 14px; margin: 12px 0; background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(240,249,255,.62)); }
.game-profile-edit h3 { margin: 0 0 8px; }
.game-profile-mini, .achievement-feed, .survey-card, .recruit-card, .wiki-card { border-color: rgba(14,165,233,.16); background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(240,249,255,.68)); }
.game-profile-mini { margin-bottom: 12px; padding: 12px; border-radius: 18px; border: 1px solid var(--line); }
.game-profile-mini h3 { margin: 0 0 6px; }
.achievement-row { display: flex; gap: 12px; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid var(--line); }
.achievement-row:last-child { border-bottom: 0; }
.achievement-row p { margin: .35rem 0 0; color: var(--muted); }
.recruit-card { margin-bottom: 14px; }
.wiki-card { margin-bottom: 12px; padding: 14px; border-radius: 18px; border: 1px solid var(--line); }
.wiki-card h3 { margin: 0 0 6px; }
.survey-card { margin-bottom: 16px; }
.survey-option { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); }
.survey-option:last-child { border-bottom: 0; }
.survey-bar { height: 10px; border-radius: 999px; background: rgba(14,165,233,.12); overflow: hidden; }
.survey-bar > span { display: block; height: 100%; background: linear-gradient(90deg, #0ea5e9, #38bdf8); border-radius: 999px; }
.report-box { margin-top: 10px; }
.report-box summary { cursor: pointer; display: inline-flex; align-items: center; border-radius: 999px; padding: .25rem .65rem; background: rgba(248,113,113,.10); color: #b91c1c; font-weight: 900; font-size: .84rem; }
.report-box form { margin-top: 10px; border: 1px dashed rgba(248,113,113,.28); border-radius: 16px; padding: 12px; background: rgba(254,242,242,.56); }
.mini-form { display: grid; gap: 8px; min-width: 180px; }
.code-box { border-color: rgba(249,115,22,.28); background: linear-gradient(135deg, rgba(255,247,237,.96), rgba(255,255,255,.86)); }
.backup-code-list { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.backup-code-list code { border-radius: 10px; padding: .35rem .6rem; background: #111827; color: #f8fafc; font-weight: 900; letter-spacing: .04em; }
.notice-line { border: 1px solid rgba(14,165,233,.18); border-radius: 18px; padding: 12px 14px; background: rgba(240,249,255,.72); margin: 12px 0; }
@media (max-width: 760px) {
  .survey-option { grid-template-columns: 1fr; }
  .achievement-row { align-items: flex-start; }
}

.brand-logo{gap:12px}.brand-image{width:56px;height:56px;object-fit:contain;border-radius:14px;background:rgba(255,255,255,.75);padding:5px;box-shadow:0 8px 24px rgba(0,0,0,.12)}.footer-logo{width:40px;height:40px;object-fit:contain;border-radius:10px;background:rgba(255,255,255,.7);padding:4px}.premium-badge{display:inline-flex;margin-left:8px;padding:3px 9px;border-radius:999px;background:linear-gradient(135deg,#ffd76a,#ffb347);color:#6b3b00;font-size:.75rem;font-weight:700;vertical-align:middle}.trust-score{margin:.35rem 0;color:#667085}.official-community-frame{border:1px solid rgba(255,179,71,.35);background:linear-gradient(180deg,rgba(255,248,236,.98),rgba(255,255,255,.98))}.official-community-grid,.shop-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}.official-community-item,.shop-item{display:flex;gap:12px;padding:12px;border:1px solid rgba(129,140,248,.15);border-radius:18px;background:#fff}.shop-item{flex-direction:column}.ad-slot{border:1px dashed rgba(129,140,248,.35);background:rgba(248,250,255,.85)}.ad-label{display:inline-block;margin-bottom:8px;padding:2px 8px;border-radius:999px;background:#eef2ff;color:#475569;font-size:.78rem;font-weight:700}.shop-item .meta{font-size:.9rem;color:#667085}


/* v1.8.0: トップヒーローロゴと複数SNS管理 */
.hero-copy{display:flex;flex-direction:column;align-items:flex-start;gap:.65rem}
.hero-logo{display:block;max-width:min(520px,88%);width:100%;height:auto;border-radius:22px;box-shadow:0 22px 70px rgba(15,23,42,.12);background:rgba(255,255,255,.55)}
.site-header .brand-image{display:none}
.sns-site-mini{display:grid;gap:.35rem}
.admin-panel .mini-form label{margin:.35rem 0}
@media (max-width: 760px){
  .hero-logo{max-width:100%;border-radius:16px}
  .hero-copy{align-items:stretch}
}

/* v1.8.1: プロフィール右カラムの空白カード風の段差を解消 */
.profile-side-panel {
  padding: 0;
  overflow: hidden;
}
.profile-side-section {
  padding: 18px 20px;
  border-bottom: 1px solid rgba(15, 23, 42, .08);
}
.profile-side-section.last,
.profile-side-section:last-child {
  border-bottom: 0;
}
.profile-side-section h3 {
  margin: 0 0 12px;
}
.profile-side-section .profile-list.compact dd:last-child,
.profile-side-section .profile-list.compact dd.no-border {
  border-bottom: 0;
  padding-bottom: 0;
  margin-bottom: 0;
}
.grid.two > aside > .card + .card {
  margin-top: 14px;
}
@media (max-width: 760px) {
  .profile-side-section { padding: 16px; }
}

/* v1.9 diary-first / floating rich cards */
:root{--float-shadow:0 22px 70px rgba(15,23,42,.13),0 2px 12px rgba(15,23,42,.06);--soft-border:1px solid rgba(255,255,255,.72)}
body{background:radial-gradient(circle at top left,rgba(56,189,248,.20),transparent 34%),linear-gradient(135deg,#eef9ff 0%,#f8fbff 44%,#fff7ed 100%)}
.card,.hero,.site-header,.admin-panel,.admin-menu,.post-card,.profile-hero,.official-notice{box-shadow:var(--float-shadow);border:var(--soft-border);backdrop-filter:blur(14px);transform:translateZ(0)}
.card:hover,.post-card:hover{box-shadow:0 30px 90px rgba(15,23,42,.16),0 4px 16px rgba(15,23,42,.08)}
.diary-hero{background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(224,242,254,.82)),url('solemi_logo.png') right 28px center/240px auto no-repeat}
.mission-hero{background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(255,247,237,.90))}
.tag-chip{display:inline-flex;align-items:center;gap:.25rem;margin:.18rem .28rem .18rem 0;padding:.24rem .62rem;border-radius:999px;background:#eef6ff;color:#14507a;font-weight:700;font-size:.78rem;border:1px solid rgba(14,165,233,.18)}
.tag-chip.game{background:#fff7ed;color:#9a3412;border-color:rgba(249,115,22,.22)}
.tag-chip.spoiler{background:#111827;color:#fff;border-color:#111827}.tag-chip.success{background:#ecfdf5;color:#047857;border-color:#a7f3d0}
.spoiler-cover{margin:1rem 0;padding:1rem;border-radius:18px;background:linear-gradient(135deg,#111827,#334155);color:#fff}.spoiler-cover summary{cursor:pointer;font-weight:800}.spoiler-cover p{color:#fff}
.mission-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}.mission-card.done{border-color:rgba(34,197,94,.38)}.progress{height:10px;border-radius:999px;background:#e5e7eb;overflow:hidden}.progress span{display:block;height:100%;background:linear-gradient(90deg,#38bdf8,#fbbf24);border-radius:999px}
.room-social .comment{margin-top:.75rem}.shop-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.shop-item{transition:transform .18s ease,box-shadow .18s ease}.shop-item:hover{transform:translateY(-4px)}
.community-shell{border-radius:28px;overflow:hidden}.community-cover{min-height:170px;padding:26px;background:linear-gradient(135deg,var(--community-color,#38bdf8),rgba(255,255,255,.78));color:#0f172a}.community-cover h1{font-size:clamp(1.8rem,5vw,3.2rem)}
.bottom-compose{position:fixed;right:18px;bottom:82px;z-index:30;width:58px;height:58px;border-radius:999px;display:grid;place-items:center;background:linear-gradient(135deg,#38bdf8,#f59e0b);color:#fff;font-size:28px;box-shadow:0 18px 42px rgba(14,165,233,.35)}
@media(max-width:760px){.site-header{position:sticky;top:8px;z-index:50}.top-nav{overflow-x:auto;white-space:nowrap}.diary-hero{background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(224,242,254,.86))}.bottom-compose{display:grid}}

.link-code-box{margin:18px 0;padding:20px;border-radius:22px;background:linear-gradient(135deg,#fff7ed,#eef2ff);border:1px solid rgba(251,146,60,.35);box-shadow:0 18px 40px rgba(15,23,42,.08);display:grid;gap:6px;max-width:420px}.link-code-box span{font-weight:800;color:#9a3412}.link-code-box strong{font-size:clamp(2rem,6vw,3.5rem);letter-spacing:.16em;color:#111827}.sso-card{max-width:760px;margin:0 auto}.game-link-card .primary,.sso-card .primary{font-size:1rem;padding:.8rem 1.2rem}.shop-item form{margin-top:auto}.stripe-note{font-size:.9rem;color:#64748b}.profile-shop-order-status{display:inline-flex;border-radius:999px;padding:.25rem .7rem;background:#eef2ff;color:#334155;font-weight:700}

/* v1.11.0: マイページCSSの強制適用と余白整理 */
.profile-hero.card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 22px;
  align-items: center;
  padding: 26px;
  margin-bottom: 24px;
  background:
    radial-gradient(circle at 12% 20%, rgba(255,255,255,.94), rgba(255,255,255,.52) 34%, transparent 60%),
    linear-gradient(135deg, var(--profile-bg, #eef7ff), rgba(255,255,255,.86));
  border-radius: 30px;
  overflow: hidden;
}
.profile-hero .actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 14px;
}
.profile-cover {
  grid-column: 1 / -1;
  margin: -26px -26px 4px;
  height: 220px;
  border-radius: 30px 30px 18px 18px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(14,165,233,.18), rgba(249,115,22,.14));
}
.profile-cover-img,
.profile-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.mypage-room.card {
  margin: 24px 0;
  padding: 24px;
  border-radius: 30px;
  background:
    radial-gradient(circle at top right, rgba(251,191,36,.20), transparent 32%),
    linear-gradient(135deg, rgba(255,255,255,.96), rgba(240,249,255,.80));
  border: 1px solid rgba(255,255,255,.78);
  box-shadow: 0 24px 80px rgba(15,23,42,.14), 0 2px 12px rgba(15,23,42,.06);
}
.mypage-room .section-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-bottom: 18px;
}
.room-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 18px;
}
.room-block {
  position: relative;
  min-height: 118px;
  padding: 18px;
  border-radius: 24px;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(14,165,233,.13);
  box-shadow: 0 16px 42px rgba(15,23,42,.08);
}
.room-block h3 {
  margin: 0 0 10px;
  font-size: 1rem;
  color: #0f4770;
}
.room-profile-image {
  display: grid;
  justify-items: center;
  align-content: center;
  text-align: center;
}
.profile-side-panel.card {
  padding: 0 !important;
  overflow: hidden;
  border-radius: 26px;
}
.profile-side-section {
  padding: 18px 20px;
  border-bottom: 1px solid rgba(15,23,42,.08);
}
.profile-side-section:last-child { border-bottom: 0; }
.profile-list.compact {
  display: grid;
  gap: 8px;
}
.profile-list.compact dt {
  font-weight: 800;
  color: #475569;
  font-size: .86rem;
}
.profile-list.compact dd {
  margin: 0 0 8px;
  padding-bottom: 8px;
  border-bottom: 1px dashed rgba(15,23,42,.08);
}
.room-social.card,
.pinned-post,
.profile-hero + .mypage-room {
  margin-top: 24px;
}
@media (max-width: 760px) {
  .profile-hero.card {
    grid-template-columns: 1fr;
    text-align: center;
    padding: 18px;
    border-radius: 24px;
  }
  .profile-cover {
    margin: -18px -18px 4px;
    height: 150px;
    border-radius: 24px 24px 16px 16px;
  }
  .profile-hero .actions,
  .mypage-room .section-head {
    justify-content: center;
  }
  .mypage-room.card {
    padding: 16px;
    border-radius: 24px;
  }
  .room-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .room-block {
    padding: 16px;
    border-radius: 20px;
  }
}

/* Soleil GAME PORTAL bridge */
.portal-bridge{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(224,242,254,.76));border-color:rgba(14,165,233,.22)}
.portal-bridge h2{margin:.15rem 0 .35rem}.portal-bridge p{margin:.2rem 0;color:var(--muted);line-height:1.8}.portal-nav-link{background:rgba(14,165,233,.10)}
@media(max-width:760px){.portal-bridge{grid-template-columns:1fr}.portal-bridge .button{width:100%;text-align:center}}

/* Guest viewing controls */
.guest-body-lock,
.guest-lock-card {
  border: 1px dashed rgba(14,165,233,.35);
  background: rgba(240,249,255,.72);
  border-radius: 18px;
  padding: 16px 18px;
  margin-top: 14px;
}
.guest-body-lock p,
.guest-lock-card p { color: var(--muted); line-height: 1.8; margin-top: 0; }
.detail-lock { margin: 18px 0 4px; }
.guest-lock-card { max-width: 820px; margin: 24px auto; padding: 26px; }
.guest-lock-card h1 { margin-top: 0; }
.user-link.muted { color: var(--muted); font-weight: 800; }
@media(max-width:760px){
  .guest-body-lock,
  .guest-lock-card { padding: 14px; border-radius: 16px; }
  .guest-body-lock .actions,
  .guest-lock-card .actions { gap: 8px; }
}


/* ゲーム起動メニュー */
.game-play-hero { margin-bottom: 18px; }
.game-play-grid { display: grid; gap: 16px; margin-bottom: 18px; }
.game-play-card { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.game-play-card h2 { margin: .35rem 0; }
.game-play-card .actions { justify-content: flex-end; }
.link-code-box { border: 1px dashed rgba(14,165,233,.45); border-radius: 18px; padding: 16px; background: rgba(224,242,254,.65); text-align: center; margin: 14px 0; }
.link-code-box span, .link-code-box small { display: block; color: var(--muted); font-weight: 700; }
.link-code-box strong { display: block; font-size: 2.1rem; letter-spacing: .16em; color: var(--primary); }
@media (max-width: 720px) {
  .game-play-card { align-items: stretch; flex-direction: column; }
  .game-play-card .actions { justify-content: flex-start; }
}