:root{color-scheme:dark;--bg:#264026;--panel:#457845;--olive:#29301a;--ink:#181a14;--gold:#d9d917;--white:#fff;--muted:#d8e0ce;--line:#ffffff28;--spring:#ed8194;--summer:#e7d544;--autumn:#e69b57;--winter:#91bdf0;font-family:"Noto Sans JP",system-ui,sans-serif;background:var(--bg);color:var(--white);font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100dvh;background:var(--bg)}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit}.app-shell{min-height:100dvh;padding-bottom:calc(76px + env(safe-area-inset-bottom))}.topbar{height:70px;background:var(--olive);display:flex;align-items:center;justify-content:space-between;padding:0 max(18px,calc((100vw - 1140px)/2));position:sticky;top:0;z-index:500}.brand{display:flex;align-items:center;gap:11px}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#457845;font-weight:800}.brand strong{display:block;font-size:17px;letter-spacing:.04em}.brand small{display:block;color:#e0e8d9;font-size:10px;margin-top:2px}.version{font-size:11px;color:#fff9b3;border:1px solid #ffffff35;padding:5px 9px;border-radius:999px}main{width:min(1140px,100%);margin:auto;padding:24px 22px}.view{display:none}.view.active{display:block;animation:appear .18s ease}@keyframes appear{from{opacity:.4;transform:translateY(3px)}to{opacity:1;transform:none}}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.section-heading h1{font-size:25px;line-height:1.2;margin:0;font-weight:700}.eyebrow{font-size:9px;letter-spacing:.15em;color:#d4dbbd;margin:0 0 4px}.primary-button,.secondary-button,.quiet-button{border:0;border-radius:12px;min-height:43px;padding:0 16px;font-weight:650}.primary-button{background:#d9d917;color:#20250e}.secondary-button{background:#ffffff18;border:1px solid #ffffff45;color:white}.quiet-button{background:transparent;border:1px solid #ffffff40;color:white;min-height:36px;padding:0 12px;font-size:12px}.wide{width:100%;margin-top:8px}.map-tabs{display:flex;gap:8px;overflow:auto;padding:2px 0 11px;scrollbar-width:none}.map-tab{white-space:nowrap;background:#ffffff13;border:1px solid #ffffff25;border-radius:999px;padding:9px 14px;font-size:12px;color:#f6f7ef}.map-tab.active{background:#d9d917;color:#252912;border-color:#d9d917;font-weight:700}.map-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:2px 0 12px}.chip-row{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}.filter-chip{border:1px solid #ffffff45;background:#ffffff10;color:#fff;border-radius:999px;padding:7px 11px;white-space:nowrap;font-size:11px}.filter-chip.active{color:#21240e;background:var(--gold);border-color:var(--gold);font-weight:700}.filter-chip[data-season="春"].active{background:var(--spring);border-color:var(--spring)}.filter-chip[data-season="夏"].active{background:var(--summer);border-color:var(--summer)}.filter-chip[data-season="秋"].active{background:var(--autumn);border-color:var(--autumn)}.filter-chip[data-season="冬"].active{background:var(--winter);border-color:var(--winter)}#map-wrap{height:min(60dvh,590px);min-height:310px;position:relative;border-radius:18px;overflow:hidden;border:1px solid #ffffff22;background:#dfe7d8;touch-action:pan-x pan-y}#map{width:100%;height:100%;z-index:1}.map-loading{position:absolute;z-index:400;left:50%;top:16px;transform:translateX(-50%);padding:10px 14px;background:#181a14e8;border-radius:999px;font-size:12px;white-space:nowrap}.map-loading.hidden{display:none}.leaflet-container{font-family:inherit}.leaflet-control-attribution{font-size:9px!important}.photo-pin{width:52px;height:52px;border:3px solid var(--season);border-radius:14px 14px 14px 5px;background:#fff;padding:2px;overflow:hidden;box-shadow:0 2px 8px #0007}.photo-pin img{width:100%;height:100%;object-fit:cover;border-radius:10px}.map-summary{font-size:12px;color:#e0e6d8;padding:11px 2px}.map-legend{display:flex;gap:13px;align-items:center;font-size:10px;color:#f4f6eb;flex-wrap:wrap}.map-legend span{display:flex;align-items:center;gap:5px}.dot{width:9px;height:9px;border-radius:50%}.spring{background:var(--spring)}.summer{background:var(--summer)}.autumn{background:var(--autumn)}.winter{background:var(--winter)}.attribution{margin-left:auto;color:#d6ddce}.overlay-button{position:fixed;right:max(16px,calc((100vw - 1100px)/2));bottom:calc(88px + env(safe-area-inset-bottom));z-index:450;border:1px solid #fff4;background:#29301a;color:white;border-radius:999px;padding:10px 14px;box-shadow:0 4px 18px #0005;font-size:12px}.overlay-button b{color:var(--gold);font-size:16px;margin-left:4px}.bottom-nav{height:calc(68px + env(safe-area-inset-bottom));padding:7px 14px calc(7px + env(safe-area-inset-bottom));display:flex;justify-content:center;gap:clamp(16px,10vw,110px);position:fixed;bottom:0;left:0;right:0;background:#29301a;z-index:700;border-top:1px solid #ffffff20}.nav-item{border:0;background:transparent;color:#dbe2d5;min-width:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:10px}.nav-item span{font-size:22px;line-height:1}.nav-item.selected{color:var(--gold)}.book-controls{display:flex;gap:9px;margin-bottom:14px}.book-controls input,.book-controls select{height:43px;border:1px solid #ffffff45;border-radius:11px;background:#29301a;color:white;padding:0 12px;min-width:0}.book-controls input{flex:1}.book-controls select{max-width:180px}.book-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.creature-card{min-width:0;background:#181a14;border:1px solid #ffffff12;border-radius:13px;overflow:hidden;cursor:pointer}.creature-card img,.creature-empty{display:block;width:100%;aspect-ratio:1;object-fit:cover;background:#29301a}.creature-empty{display:grid;place-items:center;font-size:27px}.creature-card strong{display:block;color:var(--gold);padding:8px 7px 10px;text-align:center;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.empty-state{grid-column:1/-1;padding:44px 10px;text-align:center;color:#e1e9d9;font-size:13px}.account-note{color:white;font-size:12px;margin:0 0 14px}.profile-card{background:#29301a;border:1px solid #ffffff25;border-radius:17px;padding:18px;margin-bottom:13px;color:white}.profile-card h2{font-size:15px;margin:0 0 9px;color:white}.profile-card p,.profile-card small{font-size:12px;line-height:1.65;color:white}.profile-card small{opacity:.85}.profile-card label,.form-field{display:block;color:white;font-size:12px;margin-top:13px}.profile-card input,.profile-card textarea,.form-field input,.form-field textarea,.form-field select{display:block;width:100%;margin-top:6px;min-height:43px;background:#181a14;color:white;border:1px solid #ffffff45;border-radius:10px;padding:10px 12px;outline-color:#d9d917}.profile-card input[readonly]{color:#fff}.profile-card textarea,.form-field textarea{resize:vertical}.avatar{width:76px;height:76px;border-radius:50%;border:2px solid #d9d917;background:#457845;font-size:30px;display:grid;place-items:center;margin:0 auto 12px;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.profile-meta{margin:11px 0!important}.button-row{display:flex;gap:8px;flex-wrap:wrap}.settings-title{display:flex;align-items:center;justify-content:space-between}.tag-group-row{padding:11px 0;border-top:1px solid #ffffff20;display:flex;align-items:center;justify-content:space-between;gap:8px}.tag-group-row strong{font-size:12px;color:white}.tag-list{display:flex;gap:4px;flex-wrap:wrap;margin-top:7px}.tag-badge{border-radius:999px;color:#15190f;padding:3px 8px;font-size:10px;font-weight:700}.danger-link{border:0;background:transparent;color:#ff9b9b;font-size:11px}.license-note{font-size:10px;color:#dce4d6}.modal-backdrop{position:fixed;inset:0;z-index:1000;background:#0009;display:flex;align-items:flex-end;justify-content:center;padding-top:24px}.modal{width:min(600px,100%);max-height:94dvh;overflow:auto;background:#121a00;color:#fff;border-radius:22px 22px 0 0;padding:19px 18px calc(20px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px #0007}.modal h2{font-size:18px;margin:0 0 14px}.modal-header{display:flex;justify-content:space-between;align-items:center}.icon-button{background:#ffffff18;border:0;border-radius:50%;width:36px;height:36px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.photo-preview{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;background:#29301a;display:block}.crop-controls{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:8px}.crop-controls label{font-size:10px;color:#fff}.crop-controls input{width:100%;accent-color:#d9d917}.modal-actions{display:flex;gap:9px;margin-top:16px}.modal-actions button{flex:1}.secondary-full{background:#ffffff18;border:1px solid #ffffff45;border-radius:11px;min-height:44px}.taxonomy-results{display:grid;gap:4px;margin-top:5px}.taxonomy-result{background:#ffffff12;border:1px solid #ffffff22;border-radius:10px;color:white;text-align:left;padding:9px 11px}.taxonomy-result small{display:block;opacity:.75}.location-map{height:220px;border-radius:12px;overflow:hidden;margin-top:8px}.overlay-list label{display:flex;align-items:center;gap:8px;margin:10px 0}.toast{position:fixed;z-index:2000;left:50%;bottom:calc(88px + env(safe-area-inset-bottom));transform:translate(-50%,15px);background:#181a14;color:white;border:1px solid #ffffff35;padding:10px 15px;border-radius:99px;font-size:12px;opacity:0;transition:.18s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:700px){main{padding:20px 15px}.topbar{height:62px;padding:0 15px}.section-heading h1{font-size:22px}#map-wrap{height:54dvh;min-height:300px}.book-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.creature-card strong{font-size:11px;padding:7px 4px}.book-controls select{max-width:145px;font-size:11px}.attribution{width:100%;margin-left:0}.overlay-button{right:13px}.map-tools{align-items:flex-start}.filter-chip{padding:7px 9px}}@media(max-width:390px){.book-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.book-controls select{max-width:128px;padding:0 6px}.brand small{font-size:9px}.version{font-size:10px;padding:4px 7px}}
.taxonomy-row{display:flex;align-items:center;gap:9px;margin-top:10px}.taxonomy-row .account-note{margin:0}.tag-fieldset{border:1px solid #ffffff28;border-radius:11px;margin:14px 0;padding:4px 10px 11px}.tag-fieldset legend{font-size:12px;padding:0 5px}.tag-choice{display:inline-flex;align-items:center;gap:5px;margin:3px 8px 3px 0}.photo-frame{overflow:hidden;border-radius:12px}.photo-preview{overflow:hidden;transform-origin:center}.location-pin{color:#ed8194;font-size:24px;text-shadow:0 1px 4px #000;background:transparent;border:0}.custom-filters{display:grid;gap:5px;margin:0 0 10px}.custom-filter-row{display:flex;align-items:center;gap:8px;min-width:0}.custom-filter-row>span{font-size:10px;white-space:nowrap;color:#e5eadb}.custom-filter-row .chip-row{min-width:0}.custom-filter-row .filter-chip.active{background:var(--tag-color);border-color:var(--tag-color)}.map-tab:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #d9d917;outline-offset:2px}
.bottom-nav{gap:clamp(2px,4vw,48px)}.nav-item{min-width:65px}.photo-pin{overflow:visible;position:relative}.photo-pin>img{display:block;width:100%;height:100%;object-fit:cover;border-radius:10px}.owner-avatar{position:absolute;top:-7px;left:-7px;width:21px;height:21px;display:grid;place-items:center;border-radius:50%;border:2px solid white;background:#457845;color:white;font-size:10px;font-weight:700;overflow:hidden;z-index:2;box-shadow:0 1px 5px #0008}.owner-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.creature-photo{position:relative}.community-member{display:flex;gap:12px;align-items:center;background:#181a14;border:1px solid #ffffff25;border-radius:14px;padding:12px;margin:9px 0}.member-avatar{flex:0 0 48px;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;overflow:hidden;border:2px solid var(--gold);background:#457845;font-weight:700}.member-avatar img{width:100%;height:100%;object-fit:cover}.community-member strong,.community-member small{display:block}.community-member small{font-size:10px;color:#e0e8d9;margin-top:3px}.community-member p{font-size:12px;margin:7px 0 0;white-space:pre-wrap}
.detail-photo{position:relative}.detail-photo>.owner-avatar{top:7px;left:7px;width:28px;height:28px;font-size:13px}
