:root {
  --leaf: #5f9f6d;
  --leaf-dark: #3f7650;
  --leaf-soft: #e4f1df;
  --cream: #fbf7e9;
  --paper: #fffdf7;
  --wood: #b88155;
  --wood-dark: #895d3e;
  --ink: #3d493f;
  --muted: #748077;
  --line: #dde4d7;
  --sand: #f1e5c8;
  --yellow: #f4c95d;
  --coral: #ee8977;
  --shadow: 0 8px 24px rgba(72, 89, 67, .12);
  --radius: 22px;
}

* { box-sizing: border-box; }
*:focus-visible { outline: 3px solid rgba(63,118,80,.45); outline-offset: 3px; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--ink);
  background:
    radial-gradient(circle at 12% 5%, rgba(255,255,255,.75) 0 70px, transparent 71px),
    radial-gradient(circle at 88% 18%, rgba(255,255,255,.55) 0 48px, transparent 49px),
    var(--cream);
  font-family: "Hiragino Maru Gothic ProN", "Yu Gothic", "Meiryo", system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.5;
}
body.modal-open {
  position: fixed;
  inset-inline: 0;
  width: 100%;
  overflow: hidden;
  touch-action: none;
}
button, input, select, textarea { font: inherit; }
button { color: inherit; }
a { color: var(--leaf-dark); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.app-shell { width: min(1360px, 100%); margin: 0 auto; min-height: 100vh; }
.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 22px clamp(18px, 4vw, 54px) 18px;
}
.brand { display: inline-flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.brand-mark {
  display: grid; place-items: center; width: 50px; height: 50px; border-radius: 17px;
  background: var(--leaf); transform: rotate(-3deg); box-shadow: 0 6px 0 rgba(63,118,80,.18);
}
.brand-mark svg { width: 34px; height: 34px; fill: #fff9df; }
.brand-mark .stem { fill: none; stroke: var(--leaf-dark); stroke-width: 5; stroke-linecap: round; }
.brand b { display: block; font-size: 1.2rem; letter-spacing: .03em; }
.brand small { display: block; color: var(--muted); font-size: .75rem; letter-spacing: .08em; }
.summary { display: flex; gap: 9px; }
.summary div {
  min-width: 92px; padding: 9px 13px; border: 1px solid rgba(137,93,62,.12); border-radius: 16px;
  background: rgba(255,253,247,.86); text-align: center; box-shadow: 0 3px 10px rgba(88,72,48,.06);
}
.summary strong { display: block; color: var(--wood-dark); font-size: 1.2rem; line-height: 1.15; }
.summary span { color: var(--muted); font-size: .72rem; }
.cloud-status-pill { display: inline-flex; align-items: center; gap: 7px; flex: none; min-height: 40px; border: 1px solid #cfdaca; border-radius: 999px; padding: 7px 12px; background: var(--paper); color: var(--muted); cursor: pointer; font-size: .75rem; font-weight: 900; box-shadow: 0 3px 10px rgba(72,89,67,.07); }
.cloud-status-dot { width: 9px; height: 9px; border-radius: 50%; background: #b8bdb7; box-shadow: 0 0 0 3px rgba(184,189,183,.16); }
.cloud-status-pill.is-loading .cloud-status-dot { background: #e5b23f; animation: importPulse .8s ease-in-out infinite alternate; }
.cloud-status-pill.is-synced .cloud-status-dot { background: var(--leaf); box-shadow: 0 0 0 3px rgba(95,159,109,.16); }
.cloud-status-pill.is-offline .cloud-status-dot { background: #c58d58; }
.cloud-status-pill.is-error .cloud-status-dot { background: var(--coral); }

.tabs {
  position: sticky; top: 10px; z-index: 20; display: flex; align-items: stretch; gap: 7px; width: fit-content;
  max-width: calc(100% - 20px); overflow-x: auto; scrollbar-width: none;
  margin: 0 auto 26px; padding: 7px; border: 1px solid rgba(137,93,62,.13); border-radius: 24px;
  background: rgba(255,253,247,.91); box-shadow: var(--shadow); backdrop-filter: blur(12px);
}
.tabs::-webkit-scrollbar { display: none; }
.menu-toggle { display: none; }
.nav-group { display: grid; flex: none; align-content: start; gap: 3px; padding: 0 6px 3px; border-right: 1px dashed #d8d6c8; }
.nav-group:last-child { border-right: 0; }
.nav-group-label { padding-left: 8px; color: var(--muted); font-size: .72rem; font-weight: 900; letter-spacing: .1em; }
.nav-group-items { display: flex; gap: 3px; }
.tab {
  display: inline-flex; flex: none; align-items: center; gap: 7px; border: 0; border-radius: 15px; padding: 9px 13px;
  background: transparent; cursor: pointer; font-weight: 700; transition: background .2s, color .2s, transform .2s;
}
.tab:hover { background: var(--leaf-soft); }
.tab:active { transform: scale(.97); }
.tab.is-active { color: white; background: var(--leaf); box-shadow: 0 5px 12px rgba(76,135,89,.22); }
.tab svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.household-strip { display: grid; grid-template-columns: auto minmax(120px,1fr) minmax(170px,220px) minmax(145px,175px) auto auto; align-items: center; gap: 10px; margin: 0 clamp(18px,4vw,54px) 16px; border: 1px solid #d4dfce; border-radius: 20px; padding: 10px 12px; background: linear-gradient(120deg,rgba(231,243,224,.96),rgba(255,250,232,.96)); box-shadow: 0 5px 16px rgba(72,89,67,.08); }
.household-island-mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; background: white; font-size: 1.35rem; }
.household-current small,.household-current strong { display: block; }.household-current small,.household-field span { color: var(--muted); font-size: .7rem; font-weight: 850; }.household-current strong { font-size: 1rem; }
.household-field { display: grid; gap: 2px; }.household-field select,.household-field input { width: 100%; min-height: 38px; border: 1px solid #ccd9c7; border-radius: 12px; padding: 5px 10px; background: white; color: var(--ink); }
.household-today-button,.household-manage-button { min-height: 38px; border: 1px solid #c6d6c1; border-radius: 12px; padding: 6px 11px; background: white; color: var(--leaf-dark); cursor: pointer; font-size: .75rem; font-weight: 900; white-space: nowrap; }
.household-manage-button { background: var(--leaf); color: white; border-color: var(--leaf); }

.today-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 14px; border-radius: 28px; padding: clamp(22px,4vw,38px); background: linear-gradient(125deg,#e4f2dd 0%,#fff3ca 58%,#f5dbc7 100%); box-shadow: var(--shadow); }
.today-hero h1 { margin: 0; font-size: clamp(1.8rem,4vw,3rem); }.today-date-label { margin: 8px 0 0; color: #637064; font-weight: 800; }
.today-player-badge { display: grid; grid-template-columns: 15px auto; align-items: center; gap: 0 7px; min-width: 180px; border: 1px solid rgba(255,255,255,.75); border-radius: 18px; padding: 12px 16px; background: rgba(255,255,255,.72); }
.today-player-badge>span { grid-row: span 2; width: 14px; height: 42px; border-radius: 999px; background: var(--leaf); }.today-player-badge>span.is-sky{background:#74b8db}.today-player-badge>span.is-sun{background:#e4bd44}.today-player-badge>span.is-coral{background:#e98272}.today-player-badge>span.is-grape{background:#9978b6}.today-player-badge>span.is-wood{background:#9b6d4b}.today-player-badge>span.is-mint{background:#5dbda4}.today-player-badge>span.is-rose{background:#dd86a0}.today-player-badge small { color: var(--muted); font-size: .7rem; }.today-player-badge strong { font-size: 1rem; }
.today-stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-bottom: 14px; }.today-stats button { display: grid; grid-template-columns: auto auto 1fr; align-items: center; gap: 8px; min-height: 70px; border: 1px solid var(--line); border-radius: 18px; padding: 12px 16px; background: var(--paper); cursor: pointer; text-align: left; }.today-stats button>span{font-size:1.25rem}.today-stats strong{color:var(--leaf-dark);font-size:1.35rem}.today-stats small{color:var(--muted);font-weight:800}
.today-grid { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(320px,.85fr); gap: 14px; }.today-card,.panel-card { border: 1px solid var(--line); border-radius: 24px; padding: 20px; background: var(--paper); box-shadow: 0 5px 18px rgba(72,89,67,.07); }.today-card-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}.today-card-heading h2{margin:0;font-size:1.15rem}.soft-badge{border-radius:999px;padding:6px 10px;background:var(--leaf-soft);color:var(--leaf-dark);font-size:.72rem;font-weight:900;white-space:nowrap}
.island-event-list,.today-action-list { display:grid;gap:8px }.island-event { display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;border:1px solid #e5e3d8;border-radius:16px;padding:10px 12px;background:#fff}.island-event.is-active{border-color:#9dc697;background:#eff8eb}.island-event-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:13px;background:#f7f0dc;font-size:1.2rem}.island-event strong,.island-event small{display:block}.island-event small{color:var(--muted);font-size:.72rem}.island-event>b{color:var(--leaf-dark);font-size:.72rem}.today-action-list button{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:11px;border:1px solid #e2e5dd;border-radius:16px;padding:11px;background:#fff;cursor:pointer;text-align:left}.today-action-list button>span{display:grid;place-items:center;width:39px;height:39px;border-radius:13px;background:#eef5e9;font-size:1.15rem}.today-action-list strong,.today-action-list small{display:block}.today-action-list small{margin-top:2px;color:var(--muted);font-size:.72rem}.today-action-list button>b{color:var(--leaf-dark);font-size:.73rem}

.island-settings-form,.project-editor form { display:grid;gap:11px }.island-settings-form label,.project-editor form>label { display:grid;gap:5px }.island-settings-form label>span,.project-editor label>span{color:var(--muted);font-size:.75rem;font-weight:850}.island-settings-form input,.island-settings-form select,.project-editor input,.project-editor textarea{width:100%;border:1px solid var(--line);border-radius:13px;padding:9px 11px;background:white;color:var(--ink)}.island-settings-form small{color:var(--muted);font-size:.68rem}.island-settings-form .secondary-button{margin:2px 0 0}
.player-profile-list { display:grid;gap:7px }.player-profile-row{display:grid;grid-template-columns:auto minmax(100px,1fr) minmax(90px,auto) auto auto;align-items:center;gap:6px}.player-profile-row input,.player-profile-row select{min-width:0;border:1px solid var(--line);border-radius:10px;padding:7px;background:white}.player-profile-row button,.player-add-form button{border:0;border-radius:10px;padding:8px 10px;background:var(--leaf-soft);color:var(--leaf-dark);cursor:pointer;font-weight:900}.danger-text-button{color:#a55348!important;background:#fff0eb!important}.player-color-dot{width:12px;height:30px;border-radius:999px;background:var(--leaf)}.player-color-dot.is-sky{background:#74b8db}.player-color-dot.is-sun{background:#e4bd44}.player-color-dot.is-coral{background:#e98272}.player-color-dot.is-grape{background:#9978b6}.player-color-dot.is-wood{background:#9b6d4b}.player-color-dot.is-mint{background:#5dbda4}.player-color-dot.is-rose{background:#dd86a0}.player-add-form{display:grid;grid-template-columns:1fr 120px auto;gap:6px;margin-top:10px}.player-add-form input,.player-add-form select{min-width:0;border:1px dashed #bdcdb7;border-radius:11px;padding:8px;background:#fbfdf9}

.projects-layout{display:grid;grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);gap:15px;align-items:start}.project-editor{position:sticky;top:108px}.project-item-picker{border:1px dashed #cfd9c9;border-radius:16px;padding:12px;background:#f9fcf7}.project-picker-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px}.project-picker-row button{border:0;border-radius:11px;padding:0 14px;background:var(--leaf);color:white;font-weight:900}.project-selected-items{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}.project-item-chip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:999px;padding:4px 7px 4px 4px;background:white;font-size:.7rem}.project-item-chip img{width:28px;height:28px;object-fit:contain}.project-item-chip button{width:22px;height:22px;border:0;border-radius:50%;background:#eee7da;cursor:pointer}.project-form-actions{display:flex;align-items:center;gap:8px}.project-form-actions .primary-button{margin:0}.project-board-heading{display:flex;justify-content:space-between;align-items:end;gap:10px;margin-bottom:12px}.project-board-heading h2{margin:0}.project-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.project-card{border:1px solid var(--line);border-radius:20px;padding:15px;background:var(--paper);box-shadow:0 4px 13px rgba(72,89,67,.06)}.project-card.is-completed{opacity:.72}.project-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.project-card-top span{color:var(--leaf-dark);font-size:.68rem;font-weight:900}.project-card-top h3{margin:1px 0 0;font-size:1.05rem}.project-card-top>strong{color:var(--wood-dark);font-size:1.2rem}.project-card>p{margin:7px 0;color:var(--muted);font-size:.78rem}.project-progress{height:8px;margin-top:10px;border-radius:999px;background:#e8e8df;overflow:hidden}.project-progress i{display:block;height:100%;border-radius:inherit;background:var(--leaf)}.project-card>small{color:var(--muted);font-size:.68rem}.project-missing-items{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0}.project-missing-items button{display:grid;grid-template-columns:30px minmax(0,1fr);align-items:center;gap:4px;max-width:132px;border:1px solid #e3e2d9;border-radius:10px;padding:4px;background:white;cursor:pointer;text-align:left}.project-missing-items img{width:30px;height:30px;object-fit:contain}.project-missing-items span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.65rem}.project-missing-items em{align-self:center;color:var(--muted);font-size:.68rem}.project-card-actions{display:flex;flex-wrap:wrap;gap:5px}.project-card-actions button{border:0;border-radius:9px;padding:6px 8px;background:var(--leaf-soft);color:var(--leaf-dark);cursor:pointer;font-size:.7rem;font-weight:850}

.collection-progress-panel{display:grid;grid-template-columns:auto minmax(180px,1fr) auto;align-items:center;gap:14px;margin-bottom:14px;border:1px solid var(--line);border-radius:18px;padding:12px 16px;background:var(--paper)}.collection-progress-panel.is-dual{grid-template-columns:auto minmax(160px,1fr) auto;row-gap:10px}.collection-progress-panel strong,.collection-progress-panel span{display:block}.collection-progress-panel strong{color:var(--leaf-dark);font-size:1.35rem}.collection-progress-panel span,.collection-progress-panel small{color:var(--muted);font-size:.72rem}.collection-progress-track{height:10px;border-radius:999px;background:#e4e7df;overflow:hidden}.collection-progress-track i{display:block;height:100%;background:var(--leaf)}.collection-progress-panel.is-dual .collection-progress-stat.is-donated{grid-column:1;grid-row:2}.collection-progress-panel.is-dual .collection-progress-stat.is-donated+.collection-progress-track{grid-column:2;grid-row:2}.collection-progress-panel.is-dual .collection-progress-stat.is-donated+.collection-progress-track+small{grid-column:3;grid-row:2}.collection-progress-panel.is-dual .collection-progress-stat.is-caught+.collection-progress-track i{background:#f0a84b}.collection-checker-grid{grid-template-columns:repeat(auto-fill,minmax(205px,1fr))}.collection-check-card{display:grid;grid-template-columns:72px minmax(0,1fr);gap:8px;border:1px solid var(--line);border-radius:18px;padding:9px;background:var(--paper)}.collection-check-card.is-caught{background:#fff9ea;border-color:#e9c979}.collection-check-card.is-checked{background:#eff7eb;border-color:#aed0a8}.collection-image-button{grid-row:span 2;display:grid;place-items:center;border:0;border-radius:13px;background:#f4f1e7;cursor:pointer}.collection-image-button img{width:64px;height:64px;object-fit:contain}.collection-check-card div{min-width:0}.collection-check-card small,.collection-check-card strong,.collection-check-card span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.collection-check-card small{color:var(--leaf-dark);font-size:.65rem;font-weight:900}.collection-check-card strong{font-size:.83rem}.collection-check-card span{color:var(--muted);font-size:.62rem}.collection-status-actions{grid-column:2;display:grid!important;grid-template-columns:1fr 1fr;gap:5px}.collection-caught-button,.collection-check-button{border:0;border-radius:9px;padding:5px 3px;background:#f0eee6;cursor:pointer;font-size:.64rem;font-weight:900}.collection-check-card.is-caught .collection-caught-button{background:#f0a84b;color:#fff}.collection-check-card.is-checked .collection-check-button{background:var(--leaf);color:white}
.amiibo-summary{display:flex;align-items:center;gap:18px;margin-bottom:14px}.amiibo-summary div{flex:none;text-align:center}.amiibo-summary strong,.amiibo-summary span{display:block}.amiibo-summary strong{color:var(--leaf-dark);font-size:1.8rem}.amiibo-summary span{color:var(--muted);font-size:.72rem}.amiibo-summary p{margin:0;color:var(--muted);font-size:.82rem}.amiibo-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr);gap:14px;align-items:start}.amiibo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:9px}.amiibo-card{border:1px solid var(--line);border-radius:17px;padding:7px;background:var(--paper)}.amiibo-card.is-owned{border-color:#9fc99a;background:#f0f8ec}.amiibo-card.is-active{box-shadow:0 0 0 3px rgba(95,159,109,.22)}.amiibo-person{display:grid;grid-template-columns:56px minmax(0,1fr);align-items:center;gap:7px;width:100%;border:0;background:transparent;cursor:pointer;text-align:left}.amiibo-person img{width:56px;height:56px;object-fit:contain;border-radius:14px;background:#f3efe4}.amiibo-person strong,.amiibo-person small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.amiibo-person small{color:var(--muted);font-size:.65rem}.amiibo-check{width:100%;margin-top:5px;border:0;border-radius:9px;padding:5px;background:#efede5;cursor:pointer;font-size:.68rem;font-weight:900}.amiibo-card.is-owned .amiibo-check{background:var(--leaf);color:white}.amiibo-insight{position:sticky;top:108px;max-height:calc(100vh - 130px);overflow:auto}.amiibo-insight-person{display:flex;align-items:center;gap:10px}.amiibo-insight-person>img{width:74px;height:74px;object-fit:contain;border-radius:20px;background:#f2efe5}.amiibo-insight-person h2{margin:0}.amiibo-insight-person h2 small{display:block;color:var(--muted);font-size:.7rem}.amiibo-insight section{margin-top:16px}.amiibo-insight h3{margin:0 0 7px;font-size:.94rem}.amiibo-insight h3 span{color:var(--leaf-dark);font-size:.7rem}.amiibo-insight section>p{margin:0 0 8px;color:var(--muted);font-size:.72rem}.amiibo-item-preview,.amiibo-recipe-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.amiibo-item-preview button,.amiibo-recipe-list button{min-width:0;border:1px solid #e4e2d9;border-radius:10px;padding:4px;background:white;cursor:pointer}.amiibo-item-preview img,.amiibo-recipe-list img{width:100%;height:48px;object-fit:contain}.amiibo-item-preview span,.amiibo-recipe-list span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.6rem}

.exchange-intro { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 13px; border: 1px solid #d1dfcd; border-radius: 20px; padding: 15px 18px; background: linear-gradient(120deg,#edf6ec,#fff9e9); }
.exchange-intro strong { font-size: .96rem; }
.exchange-intro p { margin: 3px 0 0; color: var(--muted); font-size: .82rem; }
.exchange-intro > span { flex: none; border-radius: 999px; padding: 7px 11px; background: white; color: var(--leaf-dark); font-size: .72rem; font-weight: 900; }
.exchange-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.exchange-refresh { margin: 0; }
.exchange-post-form { padding: 18px; }
.exchange-post-form label { display: grid; gap: 6px; }
.exchange-post-form label > span, .exchange-days legend { color: #526158; font-size: .78rem; font-weight: 850; }
.exchange-post-form input, .exchange-post-form textarea { width: 100%; border: 1px solid var(--line); border-radius: 13px; padding: 10px 12px; background: white; color: var(--ink); outline: none; }
.exchange-post-form input { min-height: 44px; }
.exchange-post-form textarea { min-height: 90px; resize: vertical; }
.exchange-post-form input:focus, .exchange-post-form textarea:focus { border-color: var(--leaf); box-shadow: 0 0 0 4px rgba(95,159,109,.13); }
.exchange-title-field { max-width: 760px; margin-bottom: 14px; }
.exchange-picker-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.exchange-item-picker { border: 1px solid var(--line); border-radius: 18px; padding: 14px; background: rgba(255,255,255,.64); }
.exchange-item-picker h3 { margin: 0; font-size: 1rem; }
.exchange-item-picker > p { margin: 2px 0 10px; color: var(--muted); font-size: .75rem; }
.exchange-picker-input { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px; }
.exchange-picker-input button { border: 0; border-radius: 12px; padding: 0 14px; background: var(--leaf); color: white; cursor: pointer; font-weight: 900; }
.exchange-search-field{display:grid;gap:6px}.exchange-search-field>span{color:var(--muted);font-size:.72rem;font-weight:800}.exchange-search-field input{width:100%;min-height:46px;border:1px solid var(--line);border-radius:13px;padding:0 13px;background:#fff}.exchange-item-suggestions{position:relative;z-index:5;display:grid;max-height:310px;overflow:auto;margin-top:6px;border:1px solid var(--line);border-radius:15px;padding:5px;background:var(--paper);box-shadow:0 14px 32px rgba(53,67,50,.16)}.exchange-item-suggestions[hidden]{display:none}.exchange-item-suggestions button{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:10px;border:0;border-radius:11px;padding:7px;background:transparent;text-align:left;cursor:pointer}.exchange-item-suggestions button:hover,.exchange-item-suggestions button:focus-visible{background:#f0f6eb}.exchange-item-suggestions img{width:44px;height:44px;object-fit:contain}.exchange-item-suggestions span,.exchange-item-suggestions strong,.exchange-item-suggestions small{display:block;min-width:0}.exchange-item-suggestions small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.exchange-item-suggestions button>b{color:var(--leaf-dark);font-size:.72rem}.trade-inventory-card{grid-column:1/-1}.trade-inventory-quick-actions{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}.trade-inventory-summary{display:flex;align-items:baseline;gap:7px;margin:12px 0 8px}.trade-inventory-summary strong{font-size:1.2rem;color:var(--leaf-dark)}.trade-inventory-summary span{color:var(--muted);font-size:.72rem}.trade-inventory-selected{max-height:260px;overflow:auto}.account-icon.is-trade{background:#efe8ff;color:#6c54a8}.exchange-offer-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;max-height:260px;overflow:auto;margin:8px 0}.exchange-offer-option{display:grid!important;grid-template-columns:auto 42px minmax(0,1fr);align-items:center;gap:7px;border:1px solid var(--line);border-radius:12px;padding:6px;background:#fff}.exchange-offer-option:has(input:checked){border-color:var(--leaf);background:#eff7eb}.exchange-offer-option img{width:40px;height:40px;object-fit:contain}.exchange-interest-offer{border:0;margin:12px 0;padding:0}.exchange-interest-offer legend{font-weight:900}.exchange-interest-offer>p{margin:2px 0;color:var(--muted);font-size:.72rem}.exchange-proposed-offer{margin:12px 16px;padding:10px;border-radius:13px;background:#f5f0ff}.exchange-proposed-offer>b{display:block;margin-bottom:6px;color:#65508c;font-size:.75rem}.exchange-quick-button{width:100%;border:1px solid #d9cfef;border-radius:10px;padding:6px;background:#f7f3ff;color:#654e91;font-size:.66rem;font-weight:900;cursor:pointer}
.event-intro{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px;border-radius:20px;padding:17px 20px;background:linear-gradient(135deg,#eef7e8,#fff6dd)}.event-intro strong{display:block}.event-intro p{margin:3px 0 0;color:var(--muted);font-size:.78rem}.event-intro>span{border-radius:999px;padding:7px 11px;background:#fff;color:#786143;font-size:.68rem;font-weight:900}.event-post-form{display:grid;gap:13px}.event-post-form label{display:grid;gap:6px}.event-post-form label>span,.event-conditions legend{color:var(--muted);font-size:.74rem;font-weight:900}.event-post-form input,.event-post-form select,.event-post-form textarea{width:100%;border:1px solid var(--line);border-radius:13px;padding:10px 12px;background:#fff;color:var(--ink)}.event-post-form textarea{min-height:110px;resize:vertical}.event-form-grid,.event-conditions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.event-conditions{border:1px solid var(--line);border-radius:16px;padding:12px}.event-conditions legend{padding:0 5px}.event-filter-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px 0}.event-calendar{display:flex;gap:8px;overflow:auto;margin-bottom:15px;padding:2px 1px 9px}.event-calendar button{min-width:118px;border:1px solid var(--line);border-radius:15px;padding:10px;background:#fff;cursor:pointer;text-align:left}.event-calendar b,.event-calendar span,.event-calendar small{display:block}.event-calendar b{color:var(--leaf-dark)}.event-calendar span{font-size:.76rem}.event-calendar small{margin-top:4px;color:var(--muted)}.event-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.event-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;border:1px solid var(--line);border-radius:20px;padding:16px;background:#fff}.event-card header{grid-column:1}.event-card h2{margin:6px 0 2px;font-size:1.05rem}.event-card header p{margin:0;color:var(--muted);font-size:.72rem}.event-category{display:inline-block;border-radius:999px;padding:4px 7px;background:#f0eee7;color:#5b665a;font-size:.64rem;font-weight:900}.event-category.is-giveaway{background:#e7f5e0;color:#3f773f}.event-category.is-turnips{background:#fff0c8;color:#866518}.event-category.is-games{background:#eee7ff;color:#6b4fa3}.event-date-block{grid-column:2;grid-row:1/3;align-self:start;border-radius:14px;padding:9px 12px;background:#f5f2e8;text-align:center}.event-date-block strong,.event-date-block span{display:block}.event-date-block span{font-size:.72rem}.event-details{grid-column:1;margin:2px 0;white-space:pre-wrap}.event-meta{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:7px}.event-meta span{border-radius:999px;padding:4px 8px;background:#f1f4ef;color:var(--muted);font-size:.66rem;font-weight:800}.event-card footer{grid-column:1/-1;display:flex;justify-content:flex-end}
.exchange-selected-items, .exchange-item-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.exchange-selected-items > small { color: var(--muted); }
.exchange-item-chip { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; border: 1px solid #d9dfd3; border-radius: 999px; padding: 4px 9px 4px 5px; background: white; font-size: .72rem; }
.exchange-item-chip img { width: 27px; height: 27px; object-fit: contain; border-radius: 50%; background: #f2efe5; }
.exchange-item-chip b { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.exchange-item-chip button { width: 23px; height: 23px; border: 0; border-radius: 50%; padding: 0; background: #f3eee4; color: #7a6e5d; cursor: pointer; }
.exchange-days { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin: 14px 0; border: 0; padding: 0; }
.exchange-days legend { float: left; width: 100%; margin-bottom: 5px; }
.exchange-days label { display: inline-flex; grid-auto-flow: column; align-items: center; gap: 4px; border: 1px solid var(--line); border-radius: 999px; padding: 6px 10px; background: white; cursor: pointer; font-size: .78rem; font-weight: 800; }
.exchange-days input { width: auto; min-height: 0; }
.exchange-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.exchange-board { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; margin-top: 14px; }
.exchange-board > .empty-state { grid-column: 1/-1; }
.exchange-card { display: flex; flex-direction: column; min-width: 0; border: 1px solid rgba(137,93,62,.14); border-radius: 22px; padding: 16px; background: var(--paper); box-shadow: 0 5px 16px rgba(72,89,67,.07); }
.exchange-card.is-closed { opacity: .7; }
.exchange-card header { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.exchange-card header h2 { margin: 7px 0 1px; font-size: 1.02rem; }
.exchange-card header p { margin: 0; color: var(--muted); font-size: .72rem; }
.exchange-status, .exchange-match, .exchange-mine { display: inline-block; margin-right: 5px; border-radius: 999px; padding: 3px 8px; font-size: .64rem; font-weight: 900; }
.exchange-status.open { background: var(--leaf-soft); color: var(--leaf-dark); }
.exchange-status.closed { background: #ece9e1; color: #77736b; }
.exchange-match { background: #fff0c7; color: #8b6510; }
.exchange-mine { background: #e9edfb; color: #58669d; }
.exchange-interest-count { flex: none; color: var(--muted); font-size: .72rem; font-weight: 800; }
.exchange-offer-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 13px; }
.exchange-offer-grid section { min-width: 0; border-radius: 15px; padding: 11px; background: #f7f4e9; }
.exchange-offer-grid section:last-child { background: #edf6ec; }
.exchange-offer-grid h3 { margin: 0; font-size: .78rem; }
.exchange-offer-grid .exchange-item-list { max-height: 116px; overflow: auto; }
.exchange-no-items { margin: 8px 0 0; color: var(--muted); font-size: .75rem; }
.exchange-availability { display: flex; align-items: center; gap: 8px; margin-top: 11px; font-size: .78rem; }
.exchange-availability b { color: var(--leaf-dark); }
.exchange-notes { margin: 10px 0 0; color: #59645b; font-size: .8rem; white-space: pre-wrap; }
.exchange-limited { width: fit-content; margin: 9px 0 0; border-radius: 999px; padding: 4px 8px; background: #eef1fa; color: #64709c; font-size: .67rem; font-weight: 800; }
.exchange-card footer { display: flex; align-items: center; gap: 9px; margin-top: auto; padding-top: 13px; }
.exchange-card footer .primary-button, .exchange-card footer .secondary-button { margin: 0; min-height: 40px; }
.exchange-report-button { margin-left: auto; border: 0; background: transparent; color: #9a756d; cursor: pointer; font-size: .72rem; text-decoration: underline; }
.exchange-active-note { color: var(--leaf-dark); font-size: .75rem; font-weight: 850; }
.exchange-conversations { margin-top: 26px; }
.exchange-conversation { margin-bottom: 9px; border: 1px solid var(--line); border-radius: 17px; background: var(--paper); overflow: hidden; }
.exchange-conversation summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; cursor: pointer; list-style: none; }
.exchange-conversation summary span { display: grid; }
.exchange-conversation summary small { color: var(--muted); }
.exchange-conversation summary > b { color: var(--leaf-dark); font-size: .75rem; }
.exchange-message-list { display: grid; gap: 8px; max-height: 320px; overflow: auto; padding: 12px 16px; border-top: 1px dashed var(--line); background: #f7f4e9; }
.exchange-message { width: fit-content; max-width: 82%; border-radius: 14px 14px 14px 4px; padding: 8px 11px; background: white; }
.exchange-message.is-mine { justify-self: end; border-radius: 14px 14px 4px 14px; background: var(--leaf-soft); }
.exchange-message small { color: var(--muted); font-size: .65rem; }
.exchange-message p { margin: 2px 0 0; white-space: pre-wrap; }
.exchange-conversation form { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; padding: 12px 16px; }
.exchange-conversation textarea { width: 100%; min-height: 64px; border: 1px solid var(--line); border-radius: 12px; padding: 9px; resize: vertical; }
.exchange-conversation form .primary-button { align-self: end; }
.exchange-conversation form [role="status"] { grid-column: 1/-1; margin: 0; color: var(--coral); font-size: .75rem; }
.exchange-dialog { width: min(560px,calc(100% - 28px)); border: 0; border-radius: 24px; padding: 24px; color: var(--ink); background: var(--paper); box-shadow: 0 24px 70px rgba(37,50,39,.28); }
.exchange-dialog::backdrop { background: rgba(45,54,45,.48); backdrop-filter: blur(4px); }
.exchange-dialog form { position: relative; }
.exchange-dialog h2 { margin: 0; }
.exchange-interest-summary { color: var(--muted); }
.exchange-dialog label { display: grid; gap: 6px; font-weight: 800; }
.exchange-dialog textarea { min-height: 130px; border: 1px solid var(--line); border-radius: 14px; padding: 11px; resize: vertical; }
.exchange-dialog-close { top: -10px; right: -10px; }
.exchange-conversation-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 11px 16px; border-top: 1px dashed var(--line); background: #fffdf6; }
.exchange-conversation-actions .primary-button, .exchange-conversation-actions .secondary-button { margin: 0; min-height: 38px; }
.exchange-block-button { margin-left: auto; border: 0; background: transparent; color: #9a756d; cursor: pointer; font-size: .72rem; text-decoration: underline; }
.exchange-confirm-state { display: flex; flex-wrap: wrap; gap: 6px; width: 100%; }
.exchange-confirm-state span { border-radius: 999px; padding: 5px 9px; background: #eef5ed; color: #4e6d54; font-size: .7rem; font-weight: 850; }
.exchange-review-form { display: block !important; margin: 0 16px 16px; border: 1px solid #ead8b1; border-radius: 16px; padding: 14px !important; background: #fff9e9; }
.exchange-review-form h3 { margin: 0 0 9px; font-size: .9rem; }
.exchange-review-form > label { display: grid; gap: 5px; margin-top: 9px; color: #59645b; font-size: .75rem; font-weight: 800; }
.exchange-review-form textarea { min-height: 70px !important; }
.exchange-score-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; }
.exchange-score-grid label { display: grid; gap: 4px; color: #59645b; font-size: .68rem; font-weight: 800; }
.exchange-score-grid select { min-height: 38px; border: 1px solid var(--line); border-radius: 10px; padding: 6px; background: white; }
.exchange-reviewed { margin: 0 16px 16px; color: var(--leaf-dark); font-size: .78rem; font-weight: 850; }
.exchange-moderation { margin-top: 26px; border: 1px solid #e4d2c4; border-radius: 22px; padding: 18px; background: #fffaf4; }
.exchange-moderation-note { color: var(--muted); font-size: .8rem; }
.exchange-moderation-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.exchange-moderation-grid > section { min-width: 0; border-radius: 16px; padding: 13px; background: white; }
.exchange-moderation-grid h3 { margin: 0 0 10px; font-size: .9rem; }
.exchange-moderation-card { margin-top: 8px; border: 1px solid var(--line); border-radius: 13px; padding: 11px; }
.exchange-moderation-card strong { font-size: .78rem; }
.exchange-moderation-card p { margin: 4px 0 9px; color: var(--muted); font-size: .72rem; }
.exchange-moderation-card > div { display: flex; flex-wrap: wrap; gap: 7px; }
.danger-button { border: 0; border-radius: 12px; padding: 9px 12px; background: #b85f55; color: white; cursor: pointer; font-weight: 850; }

main { padding: 0 clamp(18px, 4vw, 54px) 50px; }
.view { animation: appear .26s ease-out; }
@keyframes appear { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
.view-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.view-heading h1 { margin: 0; font-size: clamp(1.65rem, 3vw, 2.3rem); letter-spacing: .02em; }
.eyebrow { margin: 0 0 3px; color: var(--leaf-dark); font-weight: 800; font-size: .78rem; letter-spacing: .18em; }
.result-count { margin: 0 0 5px; color: var(--muted); font-weight: 700; }

.controls { display: flex; align-items: center; gap: 14px; margin-bottom: 13px; }
.search-box { position: relative; flex: 1 1 340px; max-width: 520px; }
.search-box svg { position: absolute; left: 16px; top: 50%; width: 21px; height: 21px; transform: translateY(-50%); fill: none; stroke: var(--muted); stroke-width: 1.8; }
.search-box input {
  width: 100%; min-height: 48px; border: 1px solid var(--line); border-radius: 16px; padding: 0 17px 0 46px;
  background: var(--paper); color: var(--ink); outline: none; box-shadow: 0 2px 8px rgba(72,89,67,.04);
}
.search-box input:focus { border-color: var(--leaf); box-shadow: 0 0 0 4px rgba(95,159,109,.14); }
.filter-pills { display: flex; gap: 7px; overflow-x: auto; padding: 3px; scrollbar-width: none; }
.filter-pills::-webkit-scrollbar { display: none; }
.pill { flex: none; border: 1px solid var(--line); border-radius: 999px; padding: 8px 13px; background: var(--paper); cursor: pointer; font-size: .86rem; font-weight: 700; }
.pill:hover, .pill.is-active { border-color: var(--leaf); background: var(--leaf-soft); color: var(--leaf-dark); }
.taxonomy-controls {
  display: flex; align-items: end; flex-wrap: wrap; gap: 9px; margin: 0 0 13px; padding: 12px;
  border: 1px solid rgba(137,93,62,.11); border-radius: 18px; background: rgba(255,253,247,.7);
}
.select-filter { display: grid; gap: 4px; min-width: min(210px, 100%); }
.select-filter span { padding-left: 4px; color: var(--muted); font-size: .75rem; font-weight: 800; }
.select-filter select {
  min-height: 43px; border: 1px solid var(--line); border-radius: 13px; padding: 0 38px 0 12px;
  background: var(--paper); color: var(--ink); cursor: pointer; outline: none;
}
.select-filter select:focus { border-color: var(--leaf); box-shadow: 0 0 0 4px rgba(95,159,109,.14); }
.clear-filter {
  min-height: 43px; border: 0; border-radius: 13px; padding: 0 14px; background: #efe9d9;
  color: var(--wood-dark); cursor: pointer; font-size: .82rem; font-weight: 800;
}
.clear-filter:hover { background: #e7dcc5; }
.recipe-taxonomy-controls label { display: grid; gap: 4px; min-width: min(210px, 100%); padding-left: 4px; color: var(--muted); font-size: .75rem; font-weight: 800; }
.recipe-taxonomy-controls select {
  min-height: 43px; border: 1px solid var(--line); border-radius: 13px; padding: 0 38px 0 12px;
  background: var(--paper); color: var(--ink); cursor: pointer; outline: none;
}
.recipe-taxonomy-controls select:focus { border-color: var(--leaf); box-shadow: 0 0 0 4px rgba(95,159,109,.14); }
.clear-filter-button {
  min-height: 43px; border: 0; border-radius: 13px; padding: 0 14px; background: #efe9d9;
  color: var(--wood-dark); cursor: pointer; font-size: .82rem; font-weight: 800;
}
.clear-filter-button:hover { background: #e7dcc5; }
.villager-sort-controls { margin-bottom: 18px; }
.legend { display: flex; gap: 18px; margin: 0 0 18px; color: var(--muted); font-size: .78rem; }
.legend span { display: inline-flex; align-items: center; gap: 6px; }
.legend-dot { width: 9px; height: 9px; border-radius: 50%; background: #a7b0a8; }
.legend-dot.unlocked { background: var(--leaf); }
.legend-dot.locked { background: #c7c9c4; }
.legend-dot.other { background: var(--yellow); }

.card-grid { display: grid; gap: 14px; }
.furniture-grid { grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); }
.villager-grid { grid-template-columns: repeat(auto-fill, minmax(245px, 1fr)); }
.furniture-card {
  position: relative; min-width: 0; border: 1px solid rgba(94,112,92,.14); border-radius: var(--radius); padding: 12px;
  background: var(--paper); box-shadow: 0 3px 12px rgba(72,89,67,.06); cursor: pointer; overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.furniture-card:hover { transform: translateY(-3px); border-color: rgba(95,159,109,.45); box-shadow: var(--shadow); }
.furniture-card:focus-visible { outline: 3px solid rgba(95,159,109,.35); outline-offset: 2px; }
.furniture-card.is-locked .item-image img { filter: grayscale(.72) opacity(.58); }
.furniture-card.is-locked .item-image { background: #edf0ea; }
.furniture-card.is-owned { border-color: rgba(95,159,109,.55); box-shadow: inset 0 0 0 2px rgba(95,159,109,.12), 0 3px 12px rgba(72,89,67,.06); }
.item-image {
  display: grid; place-items: center; width: 100%; aspect-ratio: 1.15; margin-bottom: 10px; border-radius: 16px;
  background: linear-gradient(145deg, #eef6e9, #e3f0dc); overflow: hidden;
}
.item-image img { width: 85%; height: 85%; object-fit: contain; transition: filter .2s, transform .2s; }
.furniture-card:hover .item-image img { transform: scale(1.04) rotate(-1deg); }
.card-name { min-height: 2.9em; margin: 0; font-weight: 800; font-size: .92rem; line-height: 1.4; word-break: break-word; }
.taxonomy-row { display: flex; flex-wrap: wrap; gap: 4px; min-height: 22px; margin-top: 5px; }
.taxonomy-row span {
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 2px 7px;
  border-radius: 999px; background: #f2eee2; color: #786b55; font-size: .65rem; font-weight: 700;
}
.taxonomy-row span:nth-child(2) { background: #fbe8e3; color: #995d54; }
.taxonomy-row span:nth-child(3) { background: #e3edf7; color: #4f6f8b; }
.status-row { display: flex; align-items: center; gap: 6px; margin-top: 8px; min-width: 0; }
.card-unlocker-links { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin-top: 9px; padding-top: 8px; border-top: 1px dashed #ded8c8; }
.card-unlocker-label { width: 100%; color: var(--muted); font-size: .64rem; font-weight: 800; }
.card-villager-link, .more-unlockers-link {
  min-width: 0; border: 0; border-radius: 10px; padding: 4px 7px; background: var(--leaf-soft); color: var(--leaf-dark);
  cursor: pointer; text-align: left; line-height: 1.15;
}
.card-villager-link { max-width: calc(50% - 3px); }
.card-villager-link strong, .card-villager-link small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card-villager-link strong { font-size: .68rem; }
.card-villager-link small { margin-top: 2px; opacity: .8; font-size: .58rem; }
.more-unlockers-link { align-self: stretch; font-size: .66rem; font-weight: 800; }
.card-villager-link:hover, .more-unlockers-link:hover { background: #d5e9d1; }
.status-badge { display: inline-flex; align-items: center; gap: 5px; min-width: 0; padding: 4px 8px; border-radius: 999px; font-size: .7rem; font-weight: 800; white-space: nowrap; }
.status-badge.unlocked { color: #356b43; background: #dcefdc; }
.status-badge.locked { color: #6f746e; background: #e8eae6; }
.status-badge.diy { color: #8a5e20; background: #f8e9ba; }
.status-badge.other { color: #7f6f50; background: #f1ead9; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.owned-badge { flex: none; padding: 4px 8px; border-radius: 999px; background: #dcefdc; color: #356b43; font-size: .68rem; font-weight: 800; white-space: nowrap; }
.heart-button {
  position: absolute; top: 18px; right: 18px; z-index: 2; display: grid; place-items: center; width: 34px; height: 34px;
  border: 0; border-radius: 50%; background: rgba(255,253,247,.9); box-shadow: 0 3px 8px rgba(72,89,67,.13); cursor: pointer;
}
.heart-button svg { width: 19px; height: 19px; fill: transparent; stroke: var(--coral); stroke-width: 2; }
.heart-button.is-wanted svg { fill: var(--coral); }
.heart-button:hover { transform: scale(1.08); }
.owned-button {
  position: absolute; top: 18px; left: 18px; z-index: 2; display: grid; place-items: center; width: 34px; height: 34px;
  border: 2px solid rgba(95,159,109,.45); border-radius: 50%; background: rgba(255,253,247,.92); box-shadow: 0 3px 8px rgba(72,89,67,.13); cursor: pointer;
}
.owned-button svg { width: 20px; height: 20px; fill: none; stroke: var(--leaf); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; opacity: .35; }
.owned-button.is-owned { border-color: var(--leaf); background: var(--leaf); }
.owned-button.is-owned svg { stroke: white; opacity: 1; }

.villager-card {
  position: relative; display: grid; grid-template-columns: 78px minmax(0,1fr) auto; align-items: center; gap: 13px;
  border: 1px solid rgba(94,112,92,.14); border-radius: var(--radius); padding: 12px; background: var(--paper);
  box-shadow: 0 3px 12px rgba(72,89,67,.06); cursor: pointer; transition: transform .18s, box-shadow .18s, border-color .18s;
}
.villager-card:hover { transform: translateY(-2px); border-color: rgba(95,159,109,.45); box-shadow: var(--shadow); }
.villager-card.is-done { background: linear-gradient(135deg, #fffdf7, #edf7e8); }
.villager-avatar { display: grid; place-items: center; width: 78px; height: 78px; border-radius: 23px; background: var(--sand); overflow: hidden; }
.villager-avatar img { width: 90%; height: 90%; object-fit: contain; }
.villager-name { min-width: 0; }
.villager-name strong { display: block; font-size: 1.04rem; }
.villager-name small { display: block; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.villager-name .species-chip {
  display: inline-flex; margin-top: 6px; padding: 2px 7px; border-radius: 999px;
  background: #f2ead8; color: #735f3d; font-size: .68rem; font-weight: 800;
}
.villager-name .item-count { display: block; margin-top: 4px; color: var(--leaf-dark); font-size: .75rem; font-weight: 700; }
.villager-preference-buttons { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.villager-preference-buttons button { position: relative; z-index: 2; border: 1px solid #d8ded4; border-radius: 999px; padding: 4px 7px; background: white; color: #7a817b; cursor: pointer; font-size: .62rem; font-weight: 850; }
.villager-preference-buttons button[data-villager-preference="favorite"][aria-pressed="true"] { border-color: #ed9e92; background: #fff0ed; color: #b85d52; }
.villager-preference-buttons button[data-villager-preference="resident"][aria-pressed="true"] { border-color: var(--leaf); background: var(--leaf-soft); color: var(--leaf-dark); }
.villager-preference-summary { display: flex; align-items: center; gap: 9px; margin: 0 0 13px; border: 1px solid rgba(95,159,109,.18); border-radius: 18px; padding: 10px 12px; background: rgba(255,253,247,.76); }
.villager-preference-summary > div { display: grid; grid-template-columns: 24px auto; grid-template-rows: auto auto; align-items: center; column-gap: 7px; min-width: 132px; border-radius: 13px; padding: 7px 9px; background: #f0f6ec; }
.villager-preference-summary > div > span { grid-row: 1 / 3; color: var(--leaf-dark); font-size: 1rem; }
.villager-preference-summary strong { font-size: .86rem; line-height: 1.1; }
.villager-preference-summary strong b { color: var(--leaf-dark); font-size: 1.02rem; }
.villager-preference-summary small { color: var(--muted); font-size: .64rem; }
.villager-preference-summary p { margin: 0 0 0 4px; color: var(--muted); font-size: .72rem; }
.check-control { position: relative; z-index: 2; display: grid; place-items: center; width: 38px; height: 38px; border: 2px solid #cbd2c8; border-radius: 50%; background: white; cursor: pointer; }
.check-control svg { width: 21px; height: 21px; fill: none; stroke: white; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; opacity: 0; }
.is-done .check-control { border-color: var(--leaf); background: var(--leaf); }
.is-done .check-control svg { opacity: 1; }

.load-more, .primary-button { display: block; border: 0; border-radius: 16px; padding: 12px 22px; background: var(--leaf); color: white; cursor: pointer; font-weight: 800; box-shadow: 0 5px 12px rgba(76,135,89,.2); }
.load-more { margin: 24px auto 0; }
.primary-button { margin: 18px auto 0; }
.empty-state { padding: 70px 20px; text-align: center; color: var(--muted); }
.empty-state h2 { margin: 7px 0 3px; color: var(--ink); }
.empty-state p { margin: 0; }
.empty-icon { display: block; color: var(--coral); font-size: 3.7rem; line-height: 1; }

.recommendations { margin: 0 0 22px; padding: 18px; border: 1px solid rgba(137,93,62,.13); border-radius: var(--radius); background: #f8eed8; }
.section-title-row { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.section-title-row h2 { margin: 0; font-size: 1.05rem; }
.section-title-row span { color: var(--muted); font-size: .76rem; }
.recommendation-list { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; }
.recommendation-card { display: flex; align-items: center; gap: 10px; border: 0; border-radius: 16px; padding: 9px; background: rgba(255,253,247,.92); cursor: pointer; text-align: left; }
.recommendation-card img { width: 48px; height: 48px; object-fit: contain; border-radius: 14px; background: var(--sand); }
.recommendation-card strong, .recommendation-card small { display: block; }
.recommendation-card small { color: var(--muted); }
.recommendation-card b { margin-left: auto; color: var(--leaf-dark); font-size: 1.15rem; }
.recommendation-empty { margin: 0; color: var(--muted); font-size: .88rem; }

.modal-backdrop { position: fixed; inset: 0; z-index: 50; background: rgba(44,55,46,.42); backdrop-filter: blur(3px); overscroll-behavior: none; touch-action: none; }
.detail-panel {
  position: fixed; inset: 0 0 0 auto; z-index: 60; width: min(620px, 94vw); padding: 28px; overflow-y: auto;
  overscroll-behavior: contain; -webkit-overflow-scrolling: touch; touch-action: pan-y;
  background: var(--paper); box-shadow: -18px 0 50px rgba(33,48,36,.2); animation: slideIn .22s ease-out;
}
@keyframes slideIn { from { transform: translateX(35px); opacity: 0; } to { transform: none; opacity: 1; } }
.close-button { position: sticky; top: 0; z-index: 3; float: right; display: grid; place-items: center; width: 42px; height: 42px; border: 0; border-radius: 50%; background: #eef1eb; cursor: pointer; }
.close-button svg { width: 22px; height: 22px; fill: none; stroke: var(--ink); stroke-width: 2; stroke-linecap: round; }
.detail-hero { display: grid; grid-template-columns: 150px minmax(0,1fr); gap: 22px; align-items: center; clear: both; padding-top: 4px; }
.detail-image { display: grid; place-items: center; aspect-ratio: 1; border-radius: 28px; background: linear-gradient(145deg, #eef6e9, #dcead4); overflow: hidden; }
.detail-image img { width: 90%; height: 90%; object-fit: contain; }
.detail-heading h2 { margin: 3px 0 8px; font-size: 1.5rem; line-height: 1.35; }
.detail-heading .english { margin: -3px 0 8px; color: var(--muted); }
.detail-kicker { color: var(--leaf-dark); font-size: .76rem; font-weight: 800; letter-spacing: .12em; }
.detail-taxonomy { display: flex; flex-wrap: wrap; gap: 6px; margin: -2px 0 10px; }
.detail-taxonomy span { padding: 4px 8px; border-radius: 999px; background: #f2eee2; color: #786b55; font-size: .72rem; font-weight: 700; }
.detail-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.detail-actions .primary-button, .detail-actions .secondary-button { margin: 0; }
.villager-detail-preference[aria-pressed="true"] { border-color: var(--leaf); background: var(--leaf); color: white; }
.villager-detail-preference[data-villager-preference="favorite"][aria-pressed="true"] { border-color: var(--coral); background: var(--coral); }
.wishlist-toggle, .owned-toggle, .recipe-toggle { display: inline-flex; align-items: center; gap: 7px; border-radius: 999px; padding: 8px 13px; cursor: pointer; font-weight: 800; }
.wishlist-toggle { border: 1px solid #efb0a5; background: #fff4f1; color: #a85045; }
.wishlist-toggle.is-wanted { color: white; background: var(--coral); border-color: var(--coral); }
.owned-toggle { border: 1px solid #a9cda9; background: #f1f8ee; color: #356b43; }
.owned-toggle.is-owned { border-color: var(--leaf); background: var(--leaf); color: white; }
.recipe-toggle { border: 1px solid #d5bf82; background: #fff7dc; color: #79621f; }
.recipe-toggle.is-known { border-color: #d09f30; background: #e9bd50; color: #493a12; }
.detail-section { margin-top: 28px; }
.detail-section h3 { margin: 0 0 11px; font-size: 1.03rem; }
.source-list { display: flex; flex-wrap: wrap; gap: 8px; }
.source-chip { border: 0; padding: 7px 10px; border-radius: 12px; background: #f2ead8; color: #735f3d; font-size: .82rem; font-weight: 700; }
.source-chip small { display: block; margin-top: 2px; color: #8d7a59; font-size: .68rem; font-weight: 700; }
.source-character-link { cursor: pointer; text-align: left; }
.source-chip.source-character-link { display: inline-flex; align-items: center; gap: 9px; }
.source-character-link b, .source-character-link i { margin-left: auto; color: currentColor; font-size: .72rem; font-style: normal; white-space: nowrap; }
.source-character-link:hover { filter: brightness(.96); box-shadow: 0 0 0 2px rgba(95,159,109,.14); }
.recipe-source-list { display: grid; gap: 8px; }
.recipe-source-chip { display: grid; grid-template-columns: max-content minmax(0,1fr); align-items: center; gap: 9px; border-radius: 13px; padding: 9px 11px; background: #f3f0e7; color: #5d584b; font-size: .82rem; }
.recipe-source-chip b { border-radius: 999px; padding: 3px 7px; background: rgba(255,255,255,.72); font-size: .68rem; white-space: nowrap; }
.recipe-source-chip.villager { background: #e5f3e2; color: #356b43; }
.recipe-source-chip.event { background: #fff0e2; color: #95593d; }
.recipe-source-chip.visitor { background: #e8f0f8; color: #426580; }
.recipe-source-chip.discovery { background: #f5efd2; color: #77611e; }
.recipe-source-chip.bottle { background: #e7f3f2; color: #3e6d69; }
.recipe-source-chip.shop, .recipe-source-chip.miles { background: #eee8f6; color: #67517d; }
.recipe-source-chip.source-character-link { width: 100%; border: 0; grid-template-columns: max-content minmax(0,1fr) max-content; }
.detail-back-button { margin: 0 0 16px; border: 0; border-radius: 999px; padding: 7px 12px; background: #edf5e9; color: var(--leaf-dark); cursor: pointer; font-size: .78rem; font-weight: 800; }
.source-character-method { border-radius: 18px; padding: 16px; background: #eef6e9; }
.source-character-method p { margin: 0; }
.source-current-item-row { display: grid; grid-template-columns: 84px minmax(0,1fr); align-items: center; gap: 13px; border-radius: 16px; padding: 10px; background: #f4f3eb; }
.source-current-item-row > img, .source-current-item-row > .image-fallback { width: 84px; height: 84px; border-radius: 13px; object-fit: contain; }
.source-current-item-row p { margin: 0; font-size: .86rem; }

.recipe-card { padding-top: 52px; }
.recipe-card { padding-bottom: 46px; }
.recipe-card.is-recipe-known { border-color: rgba(208,159,48,.58); background: linear-gradient(160deg, var(--paper), #fff9df); }
.recipe-card.has-spare-recipe { box-shadow: inset 0 0 0 2px rgba(93,159,109,.42); }
.recipe-check-button { position: absolute; top: 12px; left: 12px; right: 12px; display: flex; align-items: center; justify-content: center; gap: 5px; border: 1px solid #dacb9b; border-radius: 999px; padding: 6px 9px; background: #fff8e4; color: #79621f; cursor: pointer; font-size: .72rem; font-weight: 800; }
.recipe-check-button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; opacity: .35; }
.recipe-check-button.is-known { border-color: #d09f30; background: #e9bd50; color: #493a12; }
.recipe-check-button.is-known svg { opacity: 1; }
.spare-recipe-button { position:absolute; left:12px; right:12px; bottom:10px; border:1px dashed #b6b0a0; border-radius:999px; padding:6px 8px; background:#f5f2e9; color:#6f695b; cursor:pointer; font-size:.68rem; font-weight:900; }
.spare-recipe-button.has-spare { border-style:solid; border-color:#75a982; background:#dff0df; color:#356b43; }
.spare-recipe-detail-toggle { display:inline-flex; align-items:center; border:1px dashed #a9a291; border-radius:999px; padding:8px 13px; background:#f5f2e9; color:#655f51; cursor:pointer; font-weight:800; }
.spare-recipe-detail-toggle.has-spare { border-style:solid; border-color:#75a982; background:#dff0df; color:#356b43; }
.recipe-card-sources { display: grid; gap: 5px; margin-top: 8px; }
.recipe-card-sources .recipe-source-chip { grid-template-columns: max-content minmax(0,1fr); padding: 6px 7px; font-size: .68rem; }
.recipe-card-sources .recipe-source-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.design-guide { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-bottom: 15px; border: 1px solid #dfd3b7; border-radius: 20px; padding: 14px; background: #faf0d9; }
.design-guide > div { display: grid; grid-template-columns: max-content minmax(0,1fr); align-items: center; gap: 9px; border-radius: 13px; padding: 9px; background: rgba(255,255,255,.68); }
.design-guide strong { color: var(--wood-dark); font-size: .86rem; }
.design-guide span { font-size: .76rem; }
.design-guide p { grid-column: 1/-1; margin: 2px 4px 0; color: #6f654f; font-size: .78rem; }
.design-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(310px,1fr)); gap: 13px; }
.design-card { display: grid; grid-template-columns: 138px minmax(0,1fr); min-width: 0; border: 1px solid rgba(94,112,92,.14); border-radius: 20px; padding: 10px; background: var(--paper); box-shadow: 0 3px 12px rgba(72,89,67,.06); }
.design-visual { position: relative; display: block; min-height: 176px; margin-top: 0 !important; border-radius: 15px; overflow: hidden; background: #e8e1ce; }
.design-visual img { display: block; width: 100%; height: 100%; min-height: 176px; object-fit: cover; transition: transform .18s ease; }
.design-visual:hover img { transform: scale(1.035); }
.design-visual small { position: absolute; left: 7px; bottom: 7px; z-index: 1; border-radius: 999px; padding: 3px 7px; background: rgba(255,253,247,.9); color: #5c574d; box-shadow: 0 2px 7px rgba(60,50,35,.13); font-size: .58rem; font-weight: 800; }
.design-card-body { display: flex; flex-direction: column; min-width: 0; padding: 2px 2px 2px 11px; }
.design-category { align-self: flex-start; border-radius: 999px; padding: 3px 7px; background: var(--leaf-soft); color: var(--leaf-dark); font-size: .64rem; font-weight: 800; }
.design-card h2 { margin: 6px 0 3px; font-size: .93rem; line-height: 1.35; }
.design-card p { margin: 0 0 7px; color: var(--muted); font-size: .75rem; line-height: 1.4; }
.design-code-row { display: flex; align-items: center; gap: 5px; margin-top: auto; }
.design-code-row code { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-radius: 9px; padding: 6px 7px; background: #f0eee5; color: #5d5544; font-size: .68rem; font-weight: 800; }
.design-code-row button { flex: none; border: 0; border-radius: 9px; padding: 6px 8px; background: var(--leaf); color: white; cursor: pointer; font-size: .65rem; font-weight: 800; }
.design-creator { display: block; margin-top: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #7a7467; font-size: .62rem; }
.design-card a { margin-top: 5px; color: var(--leaf-dark); font-size: .68rem; font-weight: 800; text-decoration: none; }
.design-source-note { margin: 18px 3px 0; color: var(--muted); font-size: .72rem; }
.design-submit-panel { margin: 0 0 24px; border: 1px solid #d7e4d2; border-radius: 22px; background: linear-gradient(135deg,#edf7e9,#fffdf7 62%); box-shadow: 0 4px 16px rgba(72,89,67,.06); overflow: hidden; }
.design-submit-panel summary { display: flex; align-items: center; gap: 12px; padding: 15px 18px; cursor: pointer; list-style: none; }
.design-submit-panel summary::-webkit-details-marker { display: none; }
.design-submit-panel summary > span:last-child { display: grid; }
.design-submit-panel summary strong { font-size: 1rem; }
.design-submit-panel summary small { color: var(--muted); font-size: .76rem; }
.submit-plus { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 14px; background: var(--leaf); color: white; font-size: 1.35rem; font-weight: 800; transition: transform .18s ease; }
.design-submit-panel[open] .submit-plus { transform: rotate(45deg); }
.design-post-form { border-top: 1px dashed #ceddc8; padding: 18px; }
.design-form-fields { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.design-form-fields label { display: grid; gap: 5px; }
.design-form-fields label.is-wide { grid-column: span 2; }
.design-form-fields label > span { color: #526158; font-size: .78rem; font-weight: 850; }
.design-form-fields input, .design-form-fields select, .design-form-fields textarea { width: 100%; min-height: 44px; border: 1px solid var(--line); border-radius: 13px; padding: 9px 12px; background: white; color: var(--ink); outline: none; font: inherit; }
.design-form-fields textarea { min-height: 104px; resize: vertical; }
.design-form-fields input:focus, .design-form-fields select:focus, .design-form-fields textarea:focus { border-color: var(--leaf); box-shadow: 0 0 0 4px rgba(95,159,109,.13); }
.image-upload-field small { color: var(--muted); font-size: .7rem; }
.design-image-preview { width: min(360px,100%); margin: 14px 0; border: 1px solid var(--line); border-radius: 17px; padding: 8px; background: white; }
.design-image-preview img { display: block; width: 100%; max-height: 280px; border-radius: 12px; object-fit: contain; }
.rights-check { display: flex; align-items: flex-start; gap: 10px; margin-top: 16px; border-radius: 14px; padding: 12px; background: #faf4e3; font-size: .82rem; line-height: 1.5; }
.rights-check input { flex: none; width: 19px; height: 19px; margin-top: 2px; accent-color: var(--leaf); }
.design-submit-actions { display: flex; align-items: center; gap: 14px; margin-top: 14px; }
.design-submit-actions .primary-button { margin: 0; }
.design-submit-actions p { margin: 0; color: var(--leaf-dark); font-size: .8rem; font-weight: 800; }
.community-design-section { margin: 0 0 30px; }
.section-heading-row { display: flex; align-items: end; justify-content: space-between; gap: 15px; margin: 0 2px 12px; }
.section-heading-row h2 { margin: 0; font-size: 1.25rem; }
.curated-heading { margin-top: 28px; }
.empty-state.compact { min-height: 170px; }
.community-design-card .design-visual { cursor: default; }
.dream-guide strong { color: #6978b7; }
.dream-island-card .design-visual { aspect-ratio: 16 / 10; }
.dream-island-card .design-visual img { min-height: 0; }
.dream-tags { display: flex; flex-wrap: wrap; gap: 5px; margin: 5px 0 8px; }
.dream-tags span { border-radius: 999px; padding: 3px 8px; background: #edf0fb; color: #56639a; font-size: .67rem; font-weight: 800; }
.design-reactions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.design-reactions button { border: 1px solid #d9e2d5; border-radius: 999px; padding: 5px 8px; background: white; color: #6e776f; cursor: pointer; font-size: .67rem; font-weight: 800; }
.design-reactions button[aria-pressed="true"] { border-color: #e98b80; background: #fff0ed; color: #b85d52; }
.design-reactions button[data-design-reaction="save"][aria-pressed="true"] { border-color: var(--leaf); background: var(--leaf-soft); color: var(--leaf-dark); }

.rankings-view { max-width: 1180px; margin-inline: auto; }
.ranking-intro { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 0 0 15px; border: 1px solid #ead9a5; border-radius: 22px; padding: 18px 20px; background: linear-gradient(135deg,#fff3bf,#fffaf0 64%); }
.ranking-intro strong { font-size: 1.02rem; }
.ranking-intro p { margin: 3px 0 0; color: #756b52; font-size: .82rem; }
.ranking-intro > span { flex: none; border-radius: 999px; padding: 7px 11px; background: rgba(255,255,255,.8); color: #8b6a1f; font-size: .72rem; font-weight: 900; }
.ranking-filters { margin-bottom: 15px; }
.ranking-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px; }
.ranking-card { display: flex; flex-direction: column; min-width: 0; min-height: 260px; border: 1px solid rgba(94,112,92,.14); border-radius: 22px; padding: 17px; background: var(--paper); box-shadow: 0 4px 15px rgba(72,89,67,.06); }
.ranking-card-title { display: flex; align-items: center; gap: 11px; }
.ranking-card-title > span { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; border-radius: 15px; background: #fff0bf; color: #96701e; font-size: 1.2rem; font-weight: 900; }
.ranking-card-title small { color: var(--leaf-dark); font-size: .65rem; font-weight: 900; }
.ranking-card-title h2 { margin: 0; font-size: .98rem; line-height: 1.35; }
.ranking-card > p { margin: 11px 0 13px; color: var(--muted); font-size: .78rem; line-height: 1.55; }
.ranking-wait { display: grid; gap: 3px; margin-top: auto; border-radius: 15px; padding: 12px; background: #f3f1e8; }
.ranking-wait span { color: #6d6a5f; font-size: .78rem; font-weight: 900; }
.ranking-wait small { color: #858075; font-size: .68rem; }
.ranking-preview { display: grid; gap: 7px; margin: auto 0 0; padding: 0; list-style: none; }
.ranking-preview li { display: grid; grid-template-columns: 26px 36px minmax(0,1fr); align-items: center; gap: 7px; min-width: 0; border-radius: 12px; padding: 6px; background: #f4f7f0; }
.ranking-preview li:not(:has(img)) { grid-template-columns: 26px minmax(0,1fr); }
.ranking-preview img { width: 36px; height: 36px; border-radius: 10px; object-fit: contain; background: white; }
.rank-number { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 9px; background: var(--leaf); color: white; font-size: .68rem; font-weight: 900; }
.ranking-preview li > span:last-child { min-width: 0; }
.ranking-preview strong, .ranking-preview small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ranking-preview strong { font-size: .72rem; }
.ranking-preview small { color: var(--muted); font-size: .64rem; }
.ranking-policy { display: flex; gap: 13px; margin-top: 18px; border: 1px solid #d7e5d2; border-radius: 20px; padding: 17px; background: #eef7ea; }
.ranking-policy > span { display: grid; place-items: center; flex: 0 0 42px; width: 42px; height: 42px; border-radius: 15px; background: white; font-size: 1.2rem; }
.ranking-policy h2 { margin: 0 0 3px; font-size: .96rem; }
.ranking-policy p { margin: 0; color: #627066; font-size: .78rem; line-height: 1.6; }
.preview-image-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; }
.preview-image-grid article { border-radius: 16px; padding: 9px; background: #f4f3eb; text-align: center; }
.preview-image-grid article > div { display: grid; place-items: center; aspect-ratio: 1.15; border-radius: 12px; background: white; overflow: hidden; }
.preview-image-grid img, .preview-image-grid .image-fallback { width: 100%; height: 100%; object-fit: contain; }
.preview-image-grid span { display: block; margin-top: 6px; font-size: .75rem; font-weight: 800; }
.availability-facts { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 11px; }
.availability-facts span { display: inline-flex; gap: 6px; border-radius: 11px; padding: 7px 9px; background: #eef4ea; font-size: .78rem; }
.availability-facts b { color: var(--leaf-dark); }
.hemisphere-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.hemisphere-grid article { border: 1px solid var(--line); border-radius: 15px; padding: 12px; background: #fffdf7; }
.hemisphere-grid h4 { margin: 0 0 7px; color: var(--leaf-dark); }
.hemisphere-grid p { display: grid; grid-template-columns: 48px minmax(0,1fr); gap: 6px; margin: 4px 0; font-size: .8rem; }
.material-list { display: grid; gap: 8px; }
.material-card { position: relative; display: grid; grid-template-columns: 56px minmax(0,1fr) max-content; align-items: center; gap: 10px; width: 100%; border: 1px solid var(--line); border-radius: 15px; padding: 8px 45px 8px 8px; background: #fffdf7; color: inherit; text-align: left; }
button.material-card { cursor: pointer; }
button.material-card:hover { border-color: var(--leaf); background: #f2f8ee; }
.material-card > img, .material-card > .image-fallback, .material-fallback { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 11px; object-fit: contain; background: #f0eee4; }
.material-fallback { color: var(--muted); font-size: .65rem; font-weight: 800; }
.material-card strong, .material-card small { display: block; }
.material-card small { margin-top: 2px; color: var(--muted); font-size: .72rem; line-height: 1.35; }
.material-card > b { color: var(--wood-dark); white-space: nowrap; }
.material-card > i { position: absolute; right: 10px; bottom: 9px; color: var(--leaf-dark); font-size: .68rem; font-style: normal; font-weight: 800; }
.customization-notes { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.customization-notes span { padding: 7px 10px; border-radius: 12px; background: #e8f0f8; color: #4a6780; font-size: .8rem; font-weight: 700; }
.variation-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; }
.variation-card { min-width: 0; border-radius: 14px; padding: 7px; background: #f4f3eb; text-align: center; }
.variation-card > img, .variation-card > .image-fallback { width: 100%; aspect-ratio: 1; object-fit: contain; border-radius: 10px; }
.variation-card > span { display: block; margin-top: 4px; font-size: .68rem; font-weight: 700; line-height: 1.35; word-break: break-word; }
.hhp-unlock-note { margin: -2px 0 11px; border-radius: 12px; padding: 8px 10px; font-size: .78rem; font-weight: 700; }
.hhp-unlock-note.is-orderable { background: #e5f3e2; color: #356b43; }
.hhp-unlock-note.is-not-orderable { background: #f3eee2; color: #79684c; }
.unlocker-list { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
.unlocker-card { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; border: 1px solid var(--line); border-radius: 16px; padding: 7px; background: white; overflow: hidden; }
.unlocker-card.is-selected { border-color: var(--leaf); background: var(--leaf-soft); box-shadow: 0 0 0 1px rgba(95,159,109,.12); }
.unlocker-select { display: grid; grid-template-columns: 52px minmax(0,1fr) auto; gap: 9px; align-items: center; min-width: 0; border: 0; padding: 0; background: transparent; cursor: pointer; text-align: left; }
.unlocker-select img, .unlocker-select > .image-fallback { width: 52px; height: 52px; object-fit: contain; border-radius: 13px; background: var(--sand); }
.unlocker-select strong, .unlocker-select small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.unlocker-select small { color: var(--muted); }
.villager-detail-link { display: inline-flex; align-items: center; gap: 3px; margin-left: 8px; border: 0; border-radius: 999px; padding: 7px 9px; background: #edf5e9; color: var(--leaf-dark); cursor: pointer; font-size: .75rem; font-weight: 800; }
.villager-detail-link:hover { background: #dcebd7; }
.villager-detail-link b { font-size: 1rem; line-height: 1; }
.tiny-check { width: 19px; height: 19px; border: 2px solid #bcc5ba; border-radius: 50%; }
.tiny-check.is-done { border-color: var(--leaf); background: var(--leaf); box-shadow: inset 0 0 0 4px white; }
.co-unlocks { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 9px; }
.reveal-button { display: block; width: fit-content; margin: 12px auto 0; border: 1px solid #cfe0ca; border-radius: 999px; padding: 8px 14px; background: #f1f8ee; color: var(--leaf-dark); cursor: pointer; font-size: .78rem; font-weight: 800; }
.reveal-button:hover { border-color: var(--leaf); background: var(--leaf-soft); }
.villager-item-toolbar { display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
.villager-item-toolbar h3 { margin: 0; }
.villager-item-toolbar > div:first-child > span { display: block; margin-top: 3px; color: var(--leaf-dark); font-size: .76rem; font-weight: 800; }
.detail-filter-pills { display: flex; gap: 5px; padding: 3px; border-radius: 13px; background: #eeeadd; }
.detail-filter-pills button { border: 0; border-radius: 10px; padding: 7px 10px; background: transparent; cursor: pointer; font-size: .72rem; font-weight: 800; }
.detail-filter-pills button.is-active { background: var(--paper); color: var(--leaf-dark); box-shadow: 0 2px 6px rgba(72,89,67,.1); }
.mini-item {
  display: flex; flex-direction: column; min-width: 0; height: 100%; border: 1px solid rgba(94,112,92,.1);
  border-radius: 14px; padding: 7px; background: #f4f3eb; cursor: pointer; text-align: center;
}
.mini-item:hover { border-color: rgba(95,159,109,.45); background: #edf4e9; }
.mini-item img, .mini-item > .image-fallback { width: 100%; height: auto; aspect-ratio: 1; border-radius: 10px; object-fit: contain; }
.mini-item .mini-item-name {
  display: -webkit-box; min-height: 2.7em; margin-top: 5px; overflow: hidden; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; font-size: .72rem; font-weight: 700; line-height: 1.35;
}
.mini-item .orderable-badge { align-self: center; margin-top: 5px; padding: 3px 6px; border-radius: 999px; background: #dcefdc; color: #356b43; font-size: .62rem; font-weight: 800; line-height: 1.2; }
.detail-empty { margin: 0; padding: 28px 14px; border-radius: 15px; background: #f4f3eb; color: var(--muted); text-align: center; }
.more-note { margin: 10px 0 0; color: var(--muted); font-size: .75rem; }
.image-fallback { display: grid; place-items: center; width: 100%; height: 100%; background: #edf1e8; }
.image-fallback svg { width: 45%; height: 45%; fill: #b5c7ae; }
.image-fallback .stem { fill: none; stroke: #88a280; stroke-width: 5; stroke-linecap: round; }

.catalog-import-view { max-width: 1040px; margin-inline: auto; }
.import-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-bottom: 16px; }
.import-steps article { display: flex; align-items: center; gap: 11px; min-width: 0; border: 1px solid rgba(137,93,62,.12); border-radius: 18px; padding: 12px; background: rgba(255,253,247,.75); }
.import-steps article > span { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%; background: var(--leaf); color: white; font-weight: 900; box-shadow: 0 4px 0 rgba(63,118,80,.15); }
.import-steps strong, .import-steps small { display: block; }
.import-steps strong { font-size: .86rem; }
.import-steps small { margin-top: 2px; color: var(--muted); font-size: .7rem; line-height: 1.35; }
.import-card { margin-bottom: 15px; border: 1px solid rgba(94,112,92,.15); border-radius: 24px; padding: clamp(16px,3vw,25px); background: var(--paper); box-shadow: 0 5px 18px rgba(72,89,67,.07); }
.import-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 16px; }
.import-card-heading > div { display: flex; align-items: center; gap: 12px; min-width: 0; }
.import-card-heading h2 { margin: 0; font-size: 1.08rem; }
.import-card-heading p { margin: 2px 0 0; color: var(--muted); font-size: .78rem; }
.import-card-icon { display: grid; place-items: center; flex: 0 0 43px; width: 43px; height: 43px; border-radius: 15px; background: var(--leaf-soft); color: var(--leaf-dark); font-size: 1.25rem; font-weight: 900; }
.import-card-icon.is-working { background: #fff2c9; color: #8a6814; animation: importPulse 1.1s ease-in-out infinite alternate; }
.import-card-icon.is-done { background: #dff0dc; color: var(--leaf-dark); }
@keyframes importPulse { to { transform: rotate(8deg) scale(1.05); } }
.local-only-badge { flex: none; border-radius: 999px; padding: 6px 10px; background: #e8f2fa; color: #476b83; font-size: .72rem; font-weight: 800; }
.import-source-tabs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-bottom: 14px; border-radius: 17px; padding: 5px; background: #eef2e8; }
.import-source-tabs button { min-height: 46px; border: 0; border-radius: 13px; padding: 9px 13px; background: transparent; color: var(--muted); cursor: pointer; font-size: .84rem; font-weight: 900; }
.import-source-tabs button.is-active { background: white; color: var(--leaf-dark); box-shadow: 0 3px 10px rgba(74,99,70,.12); }
.import-source-pane[hidden] { display: none; }
.video-drop-zone { display: grid; place-items: center; min-height: 210px; border: 2px dashed #bed2b7; border-radius: 20px; padding: 25px; background: linear-gradient(145deg,#f6faef,#eef6e9); cursor: pointer; text-align: center; transition: border-color .2s, background .2s, transform .2s; }
.video-drop-zone:hover, .video-drop-zone.is-dragging { border-color: var(--leaf); background: var(--leaf-soft); transform: translateY(-2px); }
.video-drop-zone input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; }
.video-drop-icon { display: grid; place-items: center; width: 54px; height: 54px; margin-bottom: 9px; border-radius: 19px; background: var(--leaf); color: white; box-shadow: 0 6px 0 rgba(63,118,80,.15); font-size: 1.8rem; line-height: 1; }
.video-drop-zone strong { font-size: 1rem; }
.video-drop-zone small { margin-top: 3px; color: var(--muted); font-size: .76rem; }
.video-file-summary { display: grid; grid-template-columns: minmax(180px,280px) minmax(0,1fr); align-items: center; gap: 18px; border-radius: 19px; padding: 12px; background: #f2f5ec; }
.video-file-summary video { width: 100%; max-height: 230px; border-radius: 14px; background: #202620; object-fit: contain; }
.video-file-copy strong, .video-file-copy span { display: block; overflow-wrap: anywhere; }
.video-file-copy span { margin: 5px 0 12px; color: var(--muted); font-size: .78rem; }
.screenshot-file-summary { border: 1px solid #dbe5d6; border-radius: 18px; padding: 14px; background: #f8fbf5; }
.screenshot-summary-head { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 12px; }
.screenshot-summary-head strong, .screenshot-summary-head span { display: block; }
.screenshot-summary-head span { margin-top: 3px; color: var(--muted); font-size: .73rem; }
.screenshot-preview-list { display: grid; grid-template-columns: repeat(8,minmax(0,1fr)); gap: 7px; max-height: 250px; overflow: auto; overscroll-behavior: contain; }
.screenshot-preview-list figure { position: relative; aspect-ratio: 3/4; overflow: hidden; margin: 0; border-radius: 10px; background: #dde8d9; }
.screenshot-preview-list img { width: 100%; height: 100%; object-fit: cover; }
.screenshot-preview-list figcaption { position: absolute; right: 4px; bottom: 4px; display: grid; place-items: center; min-width: 20px; height: 20px; border-radius: 999px; padding: 0 5px; background: rgba(50,67,48,.78); color: white; font-size: .62rem; font-weight: 900; }
.screenshot-more { display: grid; place-items: center; aspect-ratio: 3/4; border-radius: 10px; background: #e4eddc; color: var(--leaf-dark); font-size: .72rem; font-weight: 900; text-align: center; }
.text-button { border: 0; padding: 4px 0; background: transparent; color: var(--leaf-dark); cursor: pointer; font-size: .78rem; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.import-options { display: grid; grid-template-columns: minmax(180px,1fr) minmax(160px,1fr) auto; align-items: end; gap: 10px; margin-top: 14px; }
.import-options.is-image-mode { grid-template-columns: minmax(180px,1fr) auto; }
.import-options label { display: grid; gap: 4px; color: var(--muted); font-size: .75rem; font-weight: 800; }
.import-options select { min-height: 46px; border: 1px solid var(--line); border-radius: 13px; padding: 0 36px 0 12px; background: white; color: var(--ink); }
.import-start-button { min-height: 46px; white-space: nowrap; }
.import-progress-card { border-color: #ead28b; background: linear-gradient(145deg,#fffdf7,#fff8dc); }
.import-progress-card .import-card-heading { margin-bottom: 13px; }
.import-progress-card .import-card-heading > strong { color: #7a5c13; font-size: 1.3rem; }
.import-progress-track { height: 12px; overflow: hidden; border-radius: 999px; background: #eadfbf; box-shadow: inset 0 1px 3px rgba(90,70,20,.12); }
.import-progress-track span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#e8b83f,#f3d46e); transition: width .2s; }
.scan-live-stats { display: flex; gap: 18px; margin: 10px 2px 13px; color: var(--muted); font-size: .78rem; }
.scan-live-stats b { margin-right: 4px; color: var(--wood-dark); }
#catalogScanStatus.is-error { color: #a4493d; font-weight: 800; }
.recognition-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin-bottom: 16px; }
.recognition-summary div { border-radius: 16px; padding: 12px; background: #f2f6ed; text-align: center; }
.recognition-summary strong, .recognition-summary span { display: block; }
.recognition-summary strong { color: var(--leaf-dark); font-size: 1.35rem; }
.recognition-summary span { color: var(--muted); font-size: .72rem; font-weight: 700; }
.catalog-result-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.catalog-result-toolbar label { display: inline-flex; align-items: center; gap: 7px; font-size: .8rem; font-weight: 800; }
.catalog-result-toolbar input, .catalog-match-card > input, .uncertain-options input { width: 18px; height: 18px; accent-color: var(--leaf); }
.catalog-match-list { display: grid; grid-template-columns: repeat(auto-fill,minmax(210px,1fr)); gap: 8px; max-height: 540px; overflow: auto; padding: 2px; }
.catalog-match-card { position: relative; display: grid; grid-template-columns: 20px 54px minmax(0,1fr) 22px; align-items: center; gap: 8px; min-width: 0; border: 1px solid var(--line); border-radius: 15px; padding: 8px; background: white; cursor: pointer; }
.catalog-match-card:hover { border-color: var(--leaf); background: #f6faf3; }
.catalog-match-card.is-already-owned { background: #f4f1e8; }
.catalog-match-image { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 11px; background: #edf4e9; }
.catalog-match-image img { width: 90%; height: 90%; object-fit: contain; }
.catalog-match-copy { min-width: 0; }
.catalog-match-copy strong, .catalog-match-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.catalog-match-copy strong { font-size: .78rem; }
.catalog-match-copy small { margin-top: 3px; color: var(--muted); font-size: .65rem; }
.catalog-match-check { display: grid; place-items: center; width: 21px; height: 21px; border-radius: 50%; background: #dcebd7; color: var(--leaf-dark); font-size: .72rem; font-weight: 900; opacity: 0; }
.catalog-match-card:has(> input:checked) .catalog-match-check { opacity: 1; }
.import-empty-result { grid-column: 1/-1; display: grid; gap: 4px; border-radius: 16px; padding: 28px; background: #f3f1e8; color: var(--muted); text-align: center; }
.import-empty-result strong { color: var(--ink); }
.uncertain-section { margin-top: 20px; border-top: 1px dashed #d8d0bd; padding-top: 17px; }
.uncertain-section h3 { margin: 0; font-size: 1rem; }
.uncertain-section > p { margin: 3px 0 11px; color: var(--muted); font-size: .75rem; }
.catalog-uncertain-list { display: grid; gap: 9px; max-height: 620px; overflow: auto; }
.uncertain-card { border: 1px solid #e2d4ad; border-radius: 16px; padding: 11px; background: #fff9e9; }
.uncertain-card > p { display: flex; align-items: baseline; gap: 8px; margin: 0 0 9px; }
.uncertain-card > p span { color: var(--muted); font-size: .68rem; }
.uncertain-card > p strong { font-size: .84rem; }
.uncertain-options { display: flex; flex-wrap: wrap; gap: 7px; }
.uncertain-options label { display: grid; grid-template-columns: 18px 42px minmax(0,1fr); align-items: center; gap: 7px; min-width: 190px; border: 1px solid #e5dcc2; border-radius: 12px; padding: 6px; background: white; cursor: pointer; }
.uncertain-options img { width: 42px; height: 42px; object-fit: contain; border-radius: 8px; background: #f2f4ec; }
.uncertain-options strong, .uncertain-options small { display: block; }
.uncertain-options strong { font-size: .74rem; }
.uncertain-options small { color: var(--muted); font-size: .62rem; }
.uncertain-options .skip-option { grid-template-columns: 18px auto; min-width: 150px; color: var(--muted); font-size: .74rem; }
.import-apply-row { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin-top: 18px; border-top: 1px solid var(--line); padding-top: 16px; }
.import-apply-row > p { margin: 0; color: var(--leaf-dark); font-size: .8rem; font-weight: 800; }
.import-apply-row > p button { border: 0; padding: 0 0 0 5px; background: transparent; color: var(--leaf-dark); cursor: pointer; font-weight: 900; text-decoration: underline; }
.import-help { margin-top: 3px; border: 1px dashed #d3c9b2; border-radius: 18px; padding: 12px 15px; background: rgba(255,253,247,.68); }
.import-help summary { cursor: pointer; color: var(--wood-dark); font-weight: 800; }
.import-help ul { margin: 10px 0 2px; padding-left: 1.25rem; color: var(--muted); font-size: .78rem; }
.import-help li + li { margin-top: 5px; }

.account-view { max-width: 1040px; margin-inline: auto; }
.account-grid { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(280px,.75fr); gap: 15px; }
.account-card { border: 1px solid rgba(94,112,92,.15); border-radius: 24px; padding: clamp(18px,3vw,26px); background: var(--paper); box-shadow: 0 5px 18px rgba(72,89,67,.07); }
.account-card-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.account-card-heading h2 { margin: 0; font-size: 1.08rem; }
.account-card-heading p { margin: 2px 0 0; color: var(--muted); font-size: .78rem; }
.account-icon { display: grid; place-items: center; flex: 0 0 46px; width: 46px; height: 46px; border-radius: 16px; background: #e8f2fa; color: #52778d; font-size: 1.25rem; font-weight: 900; }
.account-icon.is-nickname { background: #fff0c9; color: #966d16; }
.cloud-sync-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.cloud-sync-stats div { border-radius: 15px; padding: 12px 8px; background: #f2f6ee; text-align: center; }
.cloud-sync-stats strong, .cloud-sync-stats span { display: block; }
.cloud-sync-stats strong { color: var(--leaf-dark); font-size: 1.25rem; }
.cloud-sync-stats span { margin-top: 2px; color: var(--muted); font-size: .7rem; }
.account-actions { display: flex; align-items: center; gap: 13px; margin-top: 18px; }
.account-actions .primary-button { margin: 0; }
.account-actions span { color: var(--muted); font-size: .75rem; }
.nickname-field { display: grid; gap: 6px; }
.nickname-field span { color: var(--muted); font-size: .75rem; font-weight: 800; }
.nickname-field input { width: 100%; min-height: 48px; border: 1px solid var(--line); border-radius: 14px; padding: 0 14px; background: white; color: var(--ink); outline: none; }
.nickname-field input:focus { border-color: var(--leaf); box-shadow: 0 0 0 4px rgba(95,159,109,.14); }
.secondary-button { min-height: 44px; margin-top: 12px; border: 1px solid #bcd0b7; border-radius: 14px; padding: 9px 16px; background: var(--leaf-soft); color: var(--leaf-dark); cursor: pointer; font-weight: 900; }
.primary-button:disabled, .secondary-button:disabled { cursor: wait; opacity: .6; }
.field-message { min-height: 1.3em; margin: 7px 0 0; color: var(--leaf-dark); font-size: .75rem; font-weight: 800; }
.privacy-card { display: flex; align-items: flex-start; gap: 13px; margin-top: 15px; border: 1px solid #cbdccb; border-radius: 21px; padding: 17px 19px; background: #edf6ec; }
.privacy-lock { flex: none; font-size: 1.3rem; }
.privacy-card h2 { margin: 0; font-size: .96rem; }
.privacy-card p { margin: 4px 0 0; color: var(--muted); font-size: .8rem; }
.retention-policy-card { margin: 16px 0; border: 1px solid #d6e0d2; border-radius: 18px; padding: 14px 16px; background: linear-gradient(135deg, #f7f9f2, #edf6ec); color: #4b5d49; }
.retention-policy-card strong { display: block; margin-bottom: 4px; font-size: .88rem; }
.retention-policy-card p { margin: 0; color: #687565; font-size: .76rem; line-height: 1.65; }
.design-retention-card { margin: 0 0 14px; }

footer { padding: 28px clamp(18px,4vw,54px) 42px; border-top: 1px dashed #d7cfbb; color: var(--muted); font-size: .8rem; }
footer p { margin: 6px 0; }
footer summary { width: fit-content; cursor: pointer; font-weight: 700; }

@media (max-width: 980px) {
  .household-strip { grid-template-columns:auto minmax(100px,1fr) minmax(150px,200px) minmax(140px,170px); }
  .household-today-button,.household-manage-button { grid-column:span 2; }
  .today-grid,.projects-layout,.amiibo-layout { grid-template-columns:1fr; }
  .project-editor,.amiibo-insight { position:static;max-height:none; }
  .menu-toggle { position: sticky; top: 8px; z-index: 22; display: flex; align-items: center; gap: 8px; width: calc(100% - 28px); min-height: 48px; margin: 0 auto 10px; border: 1px solid rgba(137,93,62,.14); border-radius: 17px; padding: 8px 14px; background: rgba(255,253,247,.95); box-shadow: var(--shadow); backdrop-filter: blur(12px); cursor: pointer; }
  .menu-toggle > span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 10px; background: var(--leaf); color: white; }
  .menu-toggle small { margin-left: auto; color: var(--leaf-dark); font-weight: 900; }
  .tabs { display: none; position: sticky; top: 64px; width: calc(100% - 28px); max-width: none; margin: 0 auto 16px; padding: 10px; border-radius: 20px; overflow: visible; }
  .tabs.is-open { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); align-items: start; }
  .nav-group { border-right: 1px dashed #d8d6c8; }
  .nav-group:last-child { border-right: 0; }
  .nav-group-items { display: grid; gap: 4px; }
  .tab { width: 100%; padding: 9px 10px; }
  .exchange-board { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .topbar { align-items: flex-start; flex-wrap: wrap; gap: 10px; padding-top: 15px; }
  .household-strip { grid-template-columns:auto 1fr; margin-inline:14px; }
  .household-field,.household-today-button,.household-manage-button { grid-column:1/-1; }
  .household-today-button,.household-manage-button { width:100%; }
  .today-hero { align-items:flex-start;flex-direction:column; }.today-player-badge{width:100%}.today-stats{grid-template-columns:1fr}.today-grid{grid-template-columns:1fr}.today-card{padding:15px}
  .project-list{grid-template-columns:1fr}.project-board-heading{align-items:flex-start;flex-direction:column}.collection-progress-panel{grid-template-columns:auto 1fr}.collection-progress-panel>small{grid-column:1/-1}.amiibo-layout{grid-template-columns:1fr}.amiibo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.player-profile-row{grid-template-columns:auto minmax(0,1fr) auto}.player-profile-row select{grid-column:2}.player-profile-row .danger-text-button{grid-column:3}.player-add-form{grid-template-columns:1fr 110px}.player-add-form button{grid-column:1/-1}
  .brand { flex-shrink: 0; }
  .brand b { white-space: nowrap; }
  .summary { gap: 4px; }
  .summary div { min-width: 52px; padding: 7px 5px; }
  .summary span { display: none; }
  .brand small { display: none; }
  .tabs { top: 64px; bottom: auto; margin-bottom: 14px; }
  .tab { padding: 10px 12px; }
  .controls { align-items: stretch; flex-direction: column; }
  .search-box { flex-basis: auto; max-width: none; }
  .filter-pills { width: calc(100vw - 36px); }
  .taxonomy-controls { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); }
  .select-filter { min-width: 0; }
  .furniture-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
  .furniture-card { padding: 9px; border-radius: 18px; }
  .heart-button { top: 14px; right: 14px; }
  .owned-button { top: 14px; left: 14px; }
  .villager-grid { grid-template-columns: 1fr; }
  .recommendation-list { grid-template-columns: 1fr; }
  .detail-panel { inset: auto 0 0 0; width: 100%; max-height: 91vh; border-radius: 28px 28px 0 0; padding: 20px; animation-name: slideUp; }
  @keyframes slideUp { from { transform: translateY(35px); opacity: 0; } to { transform: none; opacity: 1; } }
  .detail-hero { grid-template-columns: 116px minmax(0,1fr); gap: 15px; }
  .unlocker-list { grid-template-columns: 1fr; }
  .co-unlocks { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .villager-item-toolbar { align-items: stretch; }
  .variation-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .hemisphere-grid { grid-template-columns: 1fr; }
  .design-guide { grid-template-columns: 1fr; }
  .design-guide p { grid-column: auto; }
  .design-form-fields { grid-template-columns: 1fr 1fr; }
  .design-form-fields label.is-wide { grid-column: span 2; }
  .ranking-grid { grid-template-columns: 1fr 1fr; }
  .ranking-intro { align-items: flex-start; flex-direction: column; }
  .villager-preference-summary { align-items: stretch; flex-wrap: wrap; }
  .villager-preference-summary p { flex: 1 1 100%; margin: 0 4px; }
  .import-steps { grid-template-columns: 1fr; }
  .video-file-summary { grid-template-columns: 1fr; }
  .video-file-summary video { max-height: 300px; }
  .screenshot-preview-list { grid-template-columns: repeat(6,minmax(0,1fr)); }
  .import-options { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .import-options.is-image-mode { grid-template-columns: minmax(180px,1fr) auto; }
  .import-start-button { grid-column: 1/-1; }
  .catalog-match-list { grid-template-columns: repeat(2,minmax(0,1fr)); max-height: 62vh; }
  .cloud-status-pill { order: 3; margin-left: auto; }
  .account-grid { grid-template-columns: 1fr; }
  .exchange-intro { align-items: flex-start; flex-direction: column; }
  .exchange-picker-grid, .exchange-form-row, .exchange-board, .exchange-moderation-grid { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
  .amiibo-grid{grid-template-columns:1fr}.collection-checker-grid{grid-template-columns:1fr}.amiibo-item-preview,.amiibo-recipe-list{grid-template-columns:repeat(2,minmax(0,1fr))}
  .brand b { font-size: 1rem; }
  .brand-mark { width: 42px; height: 42px; border-radius: 14px; }
  .summary { gap: 5px; }
  .summary div { min-width: 45px; }
  .summary strong { font-size: 1rem; }
  .tab { gap: 5px; padding: 9px 10px; font-size: .85rem; }
  .tabs.is-open { grid-template-columns: 1fr; max-height: 70vh; overflow-y: auto; }
  .nav-group { border-right: 0; border-bottom: 1px dashed #d8d6c8; padding-bottom: 8px; }
  .nav-group:last-child { border-bottom: 0; }
  .nav-group-items { grid-template-columns: 1fr 1fr; }
  .detail-hero { grid-template-columns: 96px minmax(0,1fr); }
  .detail-heading h2 { font-size: 1.25rem; }
  .co-unlocks { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .taxonomy-controls { grid-template-columns: 1fr; }
  .variation-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .design-grid { grid-template-columns: 1fr; }
  .design-card { grid-template-columns: 116px minmax(0,1fr); }
  .design-visual, .design-visual img { min-height: 164px; }
  .design-form-fields { grid-template-columns: 1fr; }
  .design-form-fields label.is-wide { grid-column: auto; }
  .design-submit-actions { align-items: flex-start; flex-direction: column; }
  .ranking-grid { grid-template-columns: 1fr; }
  .villager-preference-summary > div { flex: 1 1 130px; min-width: 0; }
  .import-card-heading { align-items: flex-start; }
  .local-only-badge { display: none; }
  .import-source-tabs { grid-template-columns: 1fr; }
  .screenshot-summary-head { align-items: flex-start; }
  .screenshot-preview-list { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .import-options { grid-template-columns: 1fr; }
  .import-options.is-image-mode { grid-template-columns: 1fr; }
  .import-start-button { grid-column: auto; }
  .recognition-summary strong { font-size: 1.1rem; }
  .catalog-result-toolbar { align-items: flex-start; flex-direction: column; }
  .catalog-match-list { grid-template-columns: 1fr; }
  .cloud-status-pill { min-height: 36px; padding: 6px 10px; }
  .cloud-sync-stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .account-actions { align-items: flex-start; flex-direction: column; }
  .exchange-toolbar { align-items: stretch; flex-direction: column; }
  .exchange-refresh { width: 100%; }
  .exchange-offer-grid { grid-template-columns: 1fr; }
  .exchange-availability { align-items: flex-start; flex-direction: column; }
  .exchange-conversation form { grid-template-columns: 1fr; }
  .exchange-conversation form .primary-button { width: 100%; }
  .exchange-score-grid { grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

.artwork-forgery-label{display:inline!important;font-size:.6rem!important;padding:2px 5px;border-radius:999px;vertical-align:middle}.artwork-forgery-label.has-forgery{background:#ffe7cc;color:#9b4f17}.artwork-forgery-label.always-real{background:#e6f3df;color:#39703a}.collection-check-card.is-artwork .collection-image-button{position:relative}.collection-check-card.is-artwork .collection-image-button:after{content:"比較";position:absolute;right:4px;bottom:4px;border-radius:999px;padding:2px 5px;background:rgba(54,75,49,.88);color:#fff;font-size:.56rem;font-weight:900}
.sp-amiibo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px}.sp-amiibo-card{display:grid;grid-template-rows:240px auto auto;border:1px solid var(--line);border-radius:20px;padding:10px;background:#fff;overflow:hidden}.sp-amiibo-card.is-owned{border-color:#9fc69a;background:#f0f8ec}.sp-amiibo-image{display:grid;place-items:center;border-radius:14px;background:#f3efe5;overflow:hidden}.sp-amiibo-image img{width:100%;height:100%;object-fit:contain}.sp-amiibo-copy{padding:9px 3px 6px}.sp-amiibo-copy small,.sp-amiibo-copy strong,.sp-amiibo-copy span{display:block}.sp-amiibo-copy small{color:var(--leaf-dark);font-size:.66rem;font-weight:900}.sp-amiibo-copy strong{font-size:.9rem}.sp-amiibo-copy span{color:var(--muted);font-size:.7rem}.sp-amiibo-card>button{border:0;border-radius:10px;padding:7px;background:#eeeae0;font-weight:900;cursor:pointer}.sp-amiibo-card.is-owned>button{background:var(--leaf);color:#fff}.data-source-note{color:var(--muted);font-size:.68rem}
@media (max-width:700px){.collection-progress-panel.is-dual{grid-template-columns:1fr}.collection-progress-panel.is-dual>*{grid-column:1!important;grid-row:auto!important}.event-intro{align-items:flex-start;flex-direction:column}.event-form-grid,.event-conditions,.event-board{grid-template-columns:1fr}.event-filter-row{align-items:flex-start;flex-direction:column}.sp-amiibo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.sp-amiibo-card{grid-template-rows:190px auto auto}.exchange-offer-choice{grid-template-columns:1fr}}
.artwork-comparison-dialog{width:min(820px,calc(100% - 26px));max-height:min(88vh,900px);overflow:auto;border:0;border-radius:26px;padding:26px;color:var(--ink);background:var(--paper);box-shadow:0 24px 70px rgba(37,50,39,.28);touch-action:auto}.artwork-comparison-dialog::backdrop{background:rgba(45,54,45,.55);backdrop-filter:blur(5px)}.artwork-dialog-close{position:sticky;z-index:2;float:right;top:0;margin:-12px -12px 0 0}.artwork-dialog-heading{padding-right:42px}.artwork-dialog-heading h2{margin:2px 0 0;font-size:clamp(1.45rem,4vw,2.1rem);color:var(--leaf-dark)}.artwork-dialog-heading>p:last-child{margin:2px 0 16px;color:var(--muted)}.artwork-comparison-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.artwork-comparison-grid.single{grid-template-columns:minmax(0,380px);justify-content:center}.artwork-example{margin:0;border:1px solid var(--line);border-radius:20px;padding:12px;background:#f8f5ea}.artwork-example>span{display:inline-block;border-radius:999px;padding:5px 10px;font-weight:900;font-size:.75rem}.artwork-example.genuine>span{background:#dff0d8;color:#39703a}.artwork-example.forgery>span{background:#ffe2ce;color:#94471a}.artwork-image-stage{display:grid;place-items:center;min-height:260px;margin:8px 0;border-radius:15px;background:linear-gradient(145deg,#f0ead9,#fffdf6)}.artwork-image-stage img{width:min(100%,300px);height:250px;object-fit:contain}.artwork-example figcaption{text-align:center;color:var(--muted);font-size:.72rem}.artwork-difference{margin-top:14px;border-radius:18px;padding:15px 17px}.artwork-difference.has-forgery{background:#fff0dd;border:1px solid #efcca5}.artwork-difference.always-genuine{background:#edf7e8;border:1px solid #bad7b1}.artwork-difference strong{display:block;color:var(--leaf-dark);font-size:1rem}.artwork-difference p{margin:5px 0 0;line-height:1.65}.artwork-dialog-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:15px}.artwork-source-note{color:var(--muted);font-size:.68rem;line-height:1.5}.artwork-dialog-open{overflow:hidden}.artwork-dialog-open body{overflow:hidden;touch-action:none}
@media (max-width:560px){.artwork-comparison-dialog{padding:18px}.artwork-comparison-grid{grid-template-columns:1fr}.artwork-image-stage{min-height:190px}.artwork-image-stage img{height:180px}.artwork-dialog-actions>*{width:100%}}
.trophy-summary{display:grid;grid-template-columns:auto auto minmax(180px,1fr) auto;align-items:center;gap:14px;margin-bottom:14px}.trophy-summary-medal{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:linear-gradient(145deg,#fff3bd,#efb94f);font-size:1.8rem;box-shadow:inset 0 0 0 4px rgba(255,255,255,.55)}.trophy-summary strong,.trophy-summary span{display:block}.trophy-summary strong{color:var(--leaf-dark);font-size:1.5rem}.trophy-summary span,.trophy-summary small{color:var(--muted);font-size:.73rem}.trophy-summary-progress{height:12px;border-radius:999px;background:#e4e7df;overflow:hidden}.trophy-summary-progress i{display:block;height:100%;background:linear-gradient(90deg,#e9b74d,#f4d87f);border-radius:inherit}.trophy-filters{margin-bottom:16px}.trophy-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:13px}.trophy-card{display:grid;grid-template-columns:74px minmax(0,1fr);gap:13px;align-items:center;border:1px solid var(--line);border-radius:21px;padding:14px;background:var(--paper);box-shadow:0 6px 18px rgba(47,67,48,.06)}.trophy-card.is-locked{filter:saturate(.45);background:#f2f1ec}.trophy-card.is-earned{border-color:#e3c26c;background:linear-gradient(145deg,#fffdf5,#fff7d9)}.trophy-medal{position:relative;display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:linear-gradient(145deg,#bf8a55,#e7ba85);box-shadow:inset 0 0 0 5px rgba(255,255,255,.42),0 5px 12px rgba(70,54,36,.14)}.trophy-medal i{font-style:normal;font-size:1.9rem}.trophy-medal span{position:absolute;right:-3px;bottom:0;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#fff;color:#be8a2f;font-size:.74rem}.rank-silver .trophy-medal{background:linear-gradient(145deg,#c6cbd0,#f2f4f5)}.rank-gold .trophy-medal{background:linear-gradient(145deg,#e0ae37,#ffe58d)}.rank-platinum .trophy-medal{background:linear-gradient(145deg,#9fc6c1,#e7fffa)}.rank-rainbow .trophy-medal{background:linear-gradient(135deg,#ffb7b7,#ffe597,#bce7ae,#a9d8ff,#d3b4ff)}.trophy-card-copy{min-width:0}.trophy-card-copy small{color:var(--leaf-dark);font-size:.65rem;font-weight:900}.trophy-card-copy h2{margin:2px 0 3px;font-size:1rem}.trophy-card-copy p{min-height:2.5em;margin:0;color:var(--muted);font-size:.72rem;line-height:1.45}.trophy-card-copy>strong{display:block;margin-top:4px;color:var(--muted);font-size:.65rem;text-align:right}.trophy-progress{height:7px;margin-top:9px;border-radius:99px;background:#dedfd9;overflow:hidden}.trophy-progress i{display:block;height:100%;border-radius:inherit;background:var(--leaf)}.trophy-card.is-earned .trophy-progress i{background:#e4ae35}
@media(max-width:620px){.trophy-summary{grid-template-columns:auto 1fr}.trophy-summary-progress{grid-column:1/-1}.trophy-summary>small{grid-column:1/-1}.trophy-grid{grid-template-columns:1fr}}
.profile-title-card{display:grid;grid-template-columns:minmax(210px,.72fr) minmax(300px,1.28fr);gap:18px;margin-bottom:14px;background:linear-gradient(135deg,#fff9dc,#edf7e9)}.profile-title-preview{display:flex;min-height:175px;flex-direction:column;align-items:center;justify-content:center;border:2px dashed rgba(79,124,75,.27);border-radius:19px;padding:20px;text-align:center;background:rgba(255,255,255,.58)}.profile-title-preview>span,.profile-title-mini{display:inline-block;border-radius:999px;padding:4px 9px;background:#667e58;color:#fff;font-size:.68rem;font-weight:900}.profile-title-preview>span.is-verified,.profile-title-mini{background:linear-gradient(90deg,#9b6c1d,#d3a33a);box-shadow:0 2px 7px rgba(116,77,16,.16)}.profile-title-preview strong{margin-top:8px;font-size:1.15rem}.profile-title-preview small{margin-top:3px;color:var(--muted);font-size:.67rem}.profile-title-picker{display:grid;align-content:center;grid-template-columns:minmax(0,1fr) auto;gap:9px}.profile-title-picker>div{grid-column:1/-1}.profile-title-picker h2{margin:2px 0 3px;font-size:1.12rem;color:var(--leaf-dark)}.profile-title-picker p{margin:0;color:var(--muted);font-size:.73rem;line-height:1.55}.profile-title-picker label{display:grid;gap:5px}.profile-title-picker label span{font-size:.7rem;font-weight:900}.profile-title-picker select{min-height:42px;border:1px solid var(--line);border-radius:12px;padding:0 10px;background:#fff}.profile-title-picker>[role="status"]{grid-column:1/-1;margin:0;color:var(--muted);font-size:.68rem}.verified-title-list{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding-top:12px;border-top:1px solid var(--line)}.verified-title-list>strong{grid-column:1/-1;color:var(--leaf-dark);font-size:.76rem}.verified-title-list article{display:flex;gap:8px;align-items:center;border-radius:13px;padding:9px;background:rgba(255,255,255,.67)}.verified-title-list article.is-locked{opacity:.64}.verified-title-list article>span{font-size:1rem}.verified-title-list b,.verified-title-list small{display:block}.verified-title-list b{font-size:.74rem}.verified-title-list small{color:var(--muted);font-size:.61rem;line-height:1.4}.profile-title-mini{padding:2px 6px;font-size:.59rem;vertical-align:middle}
@media(max-width:720px){.profile-title-card{grid-template-columns:1fr}.profile-title-picker{grid-template-columns:1fr}.profile-title-picker .primary-button{width:100%}.verified-title-list{grid-template-columns:1fr}}
.profile-title-mini{background:#667e58!important}.profile-title-mini.is-verified{background:linear-gradient(90deg,#9b6c1d,#d3a33a)!important;box-shadow:0 2px 7px rgba(116,77,16,.16)}

.support-view{max-width:1180px;margin-inline:auto}.support-heading{align-items:center}.support-layout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);gap:18px;align-items:start}.support-card{border:1px solid rgba(137,93,62,.14);border-radius:28px;padding:clamp(20px,3vw,32px);background:var(--paper);box-shadow:var(--shadow)}.feedback-card{background:linear-gradient(145deg,#fffdf7,#f4faef)}.funding-card{position:sticky;top:116px;background:linear-gradient(145deg,#fffdf7,#fff5d4)}.support-card-title{display:flex;align-items:center;gap:12px;margin-bottom:10px}.support-card-title>span{display:grid;place-items:center;flex:none;width:50px;height:50px;border-radius:17px;background:var(--leaf-soft);color:var(--leaf-dark);font-size:1.35rem;font-weight:900}.funding-card .support-card-title>span{background:#fff0b9;color:#a36c19}.support-card-title h2{margin:1px 0 0;font-size:1.35rem;color:var(--leaf-dark)}.support-card>p{margin:0 0 18px;color:var(--muted);line-height:1.75}.support-feedback-form{display:grid;gap:14px}.support-feedback-form fieldset{margin:0;border:0;padding:0}.support-feedback-form legend,.support-feedback-form>label>span{display:block;margin-bottom:6px;font-size:.85rem;font-weight:900}.support-feedback-form small{color:var(--muted);font-weight:700}.support-feedback-form input[type="text"],.support-feedback-form textarea,.support-feedback-form select{width:100%;border:1px solid #d4decf;border-radius:14px;padding:12px 14px;background:#fff;color:var(--ink)}.support-feedback-form textarea{min-height:150px;resize:vertical}.support-category-grid{display:flex;gap:7px;flex-wrap:wrap}.support-category-grid input{position:absolute;opacity:0;pointer-events:none}.support-category-grid span{display:block;border:1px solid #d5dfd1;border-radius:999px;padding:8px 12px;background:#fff;color:var(--muted);font-size:.82rem;font-weight:900;cursor:pointer}.support-category-grid input:checked+span{border-color:var(--leaf);background:var(--leaf-soft);color:var(--leaf-dark);box-shadow:inset 0 0 0 1px var(--leaf)}.support-form-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.support-form-actions p{margin:0;color:var(--leaf-dark);font-size:.82rem;font-weight:800}.support-privacy-note{margin:0!important;border-top:1px dashed #d8ddcf;padding-top:12px;color:var(--muted)!important;font-size:.74rem;line-height:1.55!important}.support-amounts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.support-amounts button{border:2px solid transparent;border-radius:18px;padding:13px 9px;background:#fff;box-shadow:0 4px 13px rgba(94,73,42,.07);cursor:pointer}.support-amounts button.is-selected{border-color:#ddb44c;background:#fff9da;transform:translateY(-2px)}.support-amounts strong,.support-amounts small{display:block}.support-amounts strong{font-size:1.05rem;color:var(--wood-dark)}.support-amounts small{margin-top:3px;color:var(--muted);font-size:.63rem}.support-quantity{display:flex;align-items:center;justify-content:space-between;margin:18px 0 10px;font-weight:900}.support-quantity>div{display:grid;grid-template-columns:42px 58px 42px;border:1px solid #d8d6c6;border-radius:14px;overflow:hidden;background:#fff}.support-quantity button,.support-quantity input{height:42px;border:0;background:transparent;text-align:center}.support-quantity button{cursor:pointer;font-size:1.2rem}.support-quantity input{min-width:0;border-inline:1px solid #e6e2d5}.support-total{display:flex;align-items:end;justify-content:space-between;border-top:1px dashed #d8cfaa;padding:14px 2px 12px}.support-total span{color:var(--muted);font-weight:800}.support-total strong{color:var(--wood-dark);font-size:1.8rem;line-height:1}.support-checkout-button{width:100%;min-height:50px;border:0;border-radius:16px;padding:12px 18px;background:var(--leaf);color:#fff;font-weight:900;box-shadow:0 6px 0 rgba(63,118,80,.2);cursor:pointer}.support-checkout-button:disabled{background:#b7beb3;box-shadow:none;cursor:not-allowed}.support-checkout-note{margin:10px 0!important;color:var(--muted)!important;font-size:.75rem;line-height:1.55!important}.support-points{display:grid;gap:5px;margin:14px 0 0;padding:13px 13px 13px 32px;border-radius:16px;background:rgba(255,255,255,.62);color:var(--muted);font-size:.75rem}.support-inbox{margin-top:18px;border:1px solid var(--line);border-radius:24px;padding:20px;background:var(--paper)}.support-inbox-heading,.support-inbox-item-heading,.support-inbox-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}.support-inbox-heading h2{margin:0;color:var(--leaf-dark)}.support-inbox-list{display:grid;gap:10px;margin-top:14px}.support-inbox-item{border:1px solid var(--line);border-radius:17px;padding:14px;background:#fff}.support-inbox-item-heading>div{display:flex;align-items:center;gap:8px}.support-inbox-item-heading time,.support-inbox-item>small{color:var(--muted);font-size:.72rem}.support-inbox-item>p{margin:10px 0;line-height:1.65}.support-inbox-actions{margin-top:10px;border-top:1px dashed var(--line);padding-top:9px}.support-inbox-actions span{color:var(--muted);font-size:.72rem;font-weight:900}.support-inbox-actions button{border:1px solid #cfdaca;border-radius:10px;padding:6px 9px;background:#f6faf3;color:var(--leaf-dark);font-size:.72rem;font-weight:900;cursor:pointer}.secondary-button{border:1px solid #cfdaca;border-radius:12px;padding:8px 12px;background:#fff;color:var(--leaf-dark);font-weight:900;cursor:pointer}
@media(max-width:820px){.support-layout{grid-template-columns:1fr}.funding-card{position:static}.support-heading{align-items:flex-start}.support-amounts{grid-template-columns:1fr}.support-amounts button{display:flex;align-items:center;justify-content:space-between}.support-amounts small{margin:0}.support-inbox-item-heading,.support-inbox-actions{align-items:flex-start;flex-direction:column}.support-inbox-actions{align-items:stretch}.support-inbox-actions button{width:100%}}