@import"https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=Noto+Serif+JP:wght@300;400&display=swap";*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{-webkit-font-smoothing:antialiased}button{font-family:inherit}:root{--serif: "Cormorant Garamond", "Noto Serif JP", Georgia, serif;--ink: #1a120a;--ink-2: #4a3020;--ink-3: #8a6040;--paper: #fdf6e8}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes riseUp{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%,to{opacity:.5}50%{opacity:1}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pageOpen{0%{opacity:0;transform:perspective(900px) rotateY(-45deg) translate(-20px)}to{opacity:1;transform:perspective(900px) rotateY(0) translate(0)}}.app{position:relative;width:100%;height:100vh;overflow:hidden;color:var(--ink);font-family:var(--serif);background:#1a2a10}.app--blank{background:#1a2a10}.top-actions{position:fixed;top:14px;right:16px;z-index:80;display:flex;gap:8px}.top-actions__btn{padding:5px 12px;background:#0003;border:1px solid rgba(255,255,255,.13);border-radius:20px;font-family:var(--serif);font-size:12px;letter-spacing:.5px;color:#f0f4e8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;transition:background .2s;white-space:nowrap}.top-actions__btn:hover{background:#00000054}.header{position:absolute;top:0;left:0;right:0;z-index:20;padding:60px 24px 12px;text-align:center;pointer-events:none;animation:riseUp 1s ease both;background:linear-gradient(180deg,rgba(0,0,0,.33) 0%,transparent 100%)}.header__eyebrow{margin:0 0 4px;font-size:16px;color:#d0e8c087;letter-spacing:5px;font-style:italic}.header__title{margin:0;font-size:28px;font-weight:300;font-style:italic;color:#f0f8e8;letter-spacing:3px;text-shadow:0 2px 20px rgba(0,0,0,.53)}.header__divider{width:36px;height:1px;background:linear-gradient(90deg,transparent,rgba(160,192,96,.53),transparent);margin:8px auto 6px}.scene{position:absolute;inset:0;overflow:hidden;background:#1a2a10}.scene__bg{position:absolute;inset:0;background-size:cover;background-position:center 30%;background-repeat:no-repeat}.scene__vignette{position:absolute;inset:0;background:radial-gradient(ellipse 100% 100% at 50% 50%,transparent 35%,rgba(0,0,0,.33) 100%);pointer-events:none}.scene__haze{position:absolute;top:36%;left:0;right:0;height:20%;background:linear-gradient(180deg,transparent 0%,rgba(232,244,216,.1) 50%,transparent 100%);pointer-events:none;filter:blur(8px)}.scene__wind{position:absolute;left:-10%;right:-10%;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.15),transparent);transform-origin:left center;animation:windDrift var(--wind-dur) var(--wind-delay) ease-in-out infinite;pointer-events:none}@keyframes windDrift{0%{transform:scaleX(0) translate(0);opacity:0}10%{opacity:.2}90%{opacity:.12}to{transform:scaleX(1) translate(80px);opacity:0}}.scene__seed{position:absolute;bottom:48%;width:3px;height:3px;border-radius:50%;background:#ffffffba;box-shadow:0 0 4px #ffffff87;pointer-events:none;animation:seedFloat var(--seed-dur) var(--seed-delay) ease-in-out infinite}@keyframes seedFloat{0%{transform:translateY(0) translate(0) rotate(0);opacity:0}8%{opacity:.8}92%{opacity:.4}to{transform:translateY(-90px) translate(var(--seed-drift)) rotate(200deg);opacity:0}}.scene__hint{position:absolute;top:28%;left:50%;transform:translate(-50%);width:100%;text-align:center;color:#f0f8e8cc;text-shadow:0 1px 10px rgba(0,0,0,.6);font-size:15px;font-style:italic;letter-spacing:.5px}.scene__books{position:absolute;bottom:max(12%,165px);left:50%;transform:translate(-50%);width:70%;height:120px;display:flex;justify-content:center;align-items:flex-end;gap:6vw;perspective:700px}.book{position:relative;width:clamp(95px,15vw,170px);aspect-ratio:605 / 229;cursor:pointer;-webkit-user-select:none;user-select:none;transform-origin:center bottom;transform:translate(var(--book-x, 0),var(--book-y, 0)) rotate(var(--book-rot, 0deg));z-index:10;transition:transform .35s cubic-bezier(.4,0,.2,1),filter .2s}.book:hover:not(.book--zooming){filter:brightness(1.15) drop-shadow(0 8px 16px rgba(0,0,0,.4))}.book--zooming{transform:translate(var(--book-x, 0),calc(var(--book-y, 0) - 34px)) rotate(0) scale(2.4)!important;transition:transform .38s cubic-bezier(.4,0,.2,1)!important;z-index:40}.book__grass-shadow{position:absolute;bottom:-8px;left:10%;right:10%;height:10px;background:#0006;border-radius:50%;filter:blur(5px);pointer-events:none}.book__body{position:absolute;inset:0;background-size:contain;background-position:center;background-repeat:no-repeat;filter:drop-shadow(0 4px 14px rgba(0,0,0,.35));animation:bookDrop .9s cubic-bezier(.18,.8,.28,1) both;animation-delay:var(--appear-delay, 0s)}@keyframes bookDrop{0%{opacity:0;transform:translateY(-300px) scale(.92)}60%{opacity:1;transform:translateY(0) scale(1)}80%{transform:translateY(-4px)}to{opacity:1;transform:translateY(0) scale(1)}}.book__label{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:6px;white-space:nowrap;font-style:italic;letter-spacing:1px;text-shadow:0 1px 8px rgba(0,0,0,.6),0 0 16px rgba(255,255,255,.4);pointer-events:none;font-family:var(--serif)}.book__label-badge{font-size:11px;color:#f0f8e8bf;letter-spacing:3px;margin-right:6px}.book__label-city{font-size:14px;color:#f0f8e8}.footer{position:absolute;bottom:0;left:0;right:0;z-index:20;padding:10px 20px 20px;display:flex;flex-direction:column;align-items:center;gap:8px;background:linear-gradient(0deg,rgba(0,0,0,.33) 0%,transparent 100%);pointer-events:none}.footer>*{pointer-events:auto}.footer__error{font-size:11px;color:#f0d0b0;background:#00000045;border:1px solid rgba(192,128,68,.2);border-radius:6px;padding:6px 14px;max-width:320px;text-align:center;font-style:italic;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);margin:0}.locate-btn{position:relative;border-radius:40px;font-family:var(--serif);font-size:13px;letter-spacing:1.8px;cursor:pointer;transition:all .3s;padding:11px 28px;background:linear-gradient(135deg,#2a5a1087,#1a4a0887);border:1px solid rgba(112,192,64,.33);color:#d0f0a8;box-shadow:0 4px 24px #00000045;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.locate-btn:hover:not(:disabled){background:linear-gradient(135deg,#3a7a18ab,#2a6010ab);box-shadow:0 6px 32px #00000054;transform:translateY(-2px)}.locate-btn:disabled{background:transparent;border-color:#70c04033;color:#a0d07087;cursor:not-allowed}.footer__hint{font-size:10px;color:#a0c07866;text-align:center;line-height:1.7;font-style:italic;margin:0}.setup{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;overflow:hidden;font-family:var(--serif);color:var(--ink);background:#1a2a10}.setup__bg{position:absolute;inset:-20px;background-size:cover;background-position:center 30%;background-repeat:no-repeat;filter:blur(16px) brightness(.75) saturate(1.05);transform:scale(1.08)}.setup__scrim{position:absolute;inset:0;background:radial-gradient(ellipse 90% 70% at 50% 45%,#141e0a59,#0e140899)}.setup__card{position:relative;z-index:1;width:100%;max-width:460px;background:linear-gradient(160deg,var(--paper) 0%,#f0e4cc 100%);border-radius:3px 14px 14px 3px;padding:34px 32px;box-shadow:0 24px 60px #00000073}.setup__eyebrow{margin:0;font-size:12px;color:var(--ink-3);letter-spacing:4px}.setup__title{margin:8px 0 14px;font-size:26px;font-weight:300;font-style:italic;color:var(--ink);letter-spacing:.5px;line-height:1.4}.setup__desc{margin:0 0 22px;font-size:14px;line-height:1.9;color:var(--ink-2)}.setup__form{display:flex;gap:8px}.setup__input{flex:1;padding:10px 12px;border-radius:4px;border:1px solid rgba(200,160,96,.4);background:#ffffff80;font-family:var(--serif);font-size:15px;color:var(--ink)}.setup__input::placeholder{color:var(--ink-3);font-style:italic}.setup__search-btn{border:1px solid rgba(200,160,96,.4);border-radius:4px;padding:10px 18px;background:var(--ink-2);color:#fdf6e8;font-family:var(--serif);letter-spacing:1px;cursor:pointer}.setup__error{margin:10px 0 0;font-size:13px;font-style:italic;color:#7a2a1a}.setup__candidates{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;max-height:260px;overflow-y:auto}.setup__candidate-btn{width:100%;text-align:left;border:1px solid rgba(200,160,96,.4);background:#fffdf699;border-radius:4px;padding:10px 12px;cursor:pointer;display:flex;flex-direction:column;gap:2px;font-family:var(--serif)}.setup__candidate-btn:hover{background:#fffdf6e6}.setup__candidate-city{font-weight:600;font-style:italic;color:var(--ink);font-size:16px}.setup__candidate-full{font-size:11px;color:var(--ink-3)}.modal-overlay{position:fixed;inset:0;z-index:200;background:#00180054;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;padding:16px}.notebook-page,.ranking-page{width:100%;max-width:560px;max-height:88vh;overflow-y:auto;background:linear-gradient(160deg,var(--paper) 0%,#f0e4cc 100%);border-radius:3px 10px 10px 3px;padding:20px 22px 24px;box-shadow:0 8px 40px #0006;position:relative;animation:pageOpen .45s cubic-bezier(.22,.68,0,1.1) both;font-family:var(--serif)}.notebook-page:before,.ranking-page:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(180deg,transparent,transparent 31px,rgba(200,160,96,.13) 31px,rgba(200,160,96,.13) 32px);background-position:0 74px;opacity:.7}.notebook-page__header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:14px;padding-bottom:13px;border-bottom:1px solid rgba(200,160,96,.2);position:relative;z-index:1}.notebook-page__eyebrow{margin:0;font-size:9px;color:var(--ink-3);letter-spacing:4px}.notebook-page__header h2{margin:4px 0 0;font-size:22px;font-weight:300;font-style:italic;color:var(--ink);letter-spacing:1.5px}.notebook-page__close{width:28px;height:28px;border-radius:50%;background:#f0e0c0;border:1px solid rgba(200,160,96,.27);cursor:pointer;font-size:12px;color:var(--ink-2);display:flex;align-items:center;justify-content:center;transition:background .15s;flex-shrink:0}.notebook-page__close:hover{background:#e8cca8}.notebook-page__body{position:relative;z-index:1}.notebook-page__hint{font-size:12px;font-style:italic;color:var(--ink-3);margin:4px 0 12px;letter-spacing:.3px}.notebook-page__hint--small{margin-top:20px;font-weight:600;letter-spacing:2px;font-style:normal;font-size:10px;text-transform:uppercase}.notebook-page__loading,.notebook-page__empty{font-size:13px;font-style:italic;color:var(--ink-3)}.notebook-page__textarea{width:100%;min-height:120px;border-radius:4px;border:1px solid rgba(200,160,96,.33);background:#fff6;padding:12px 14px;font-size:15px;line-height:1.8;resize:vertical;font-family:var(--serif);font-weight:300;color:var(--ink);letter-spacing:.3px}.notebook-page__textarea::placeholder{color:var(--ink-3);font-style:italic}.notebook-page__submit{margin-top:10px;width:100%;border:1px solid rgba(200,160,96,.4);border-radius:20px;padding:11px;background:var(--ink-2);color:#fdf6e8;font-family:var(--serif);font-size:14px;letter-spacing:1.5px;cursor:pointer;transition:opacity .2s}.notebook-page__submit:hover:not(:disabled){opacity:.88}.notebook-page__submit:disabled{opacity:.4;cursor:default}.entries-list{display:flex;flex-direction:column;gap:12px}.entry-card{border:1px solid rgba(200,160,96,.27);background:#fffdf680;border-radius:4px;padding:12px 14px}.entry-date{font-size:10px;font-style:italic;color:var(--ink-3);margin-bottom:5px;letter-spacing:.5px}.entry-content{font-size:15px;line-height:1.8;font-weight:300;color:var(--ink);white-space:pre-wrap}.like-btn{margin-top:8px;border:1px solid rgba(200,160,96,.33);background:transparent;border-radius:20px;padding:3px 12px;font-family:var(--serif);font-size:13px;color:var(--ink-2);cursor:pointer}.like-btn--liked{background:#c8a06026;cursor:default}.kaisei-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid rgba(112,192,64,.4);border-radius:40px;padding:13px;margin-bottom:18px;background:linear-gradient(135deg,#3a7a18d9,#1a4a08d9);color:#eaf6d8;font-family:var(--serif);font-style:italic;font-size:16px;letter-spacing:1.2px;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 16px #1a4a084d;position:relative;z-index:1}.kaisei-btn:hover:not(:disabled){transform:translateY(-1px)}.kaisei-btn--voted{background:#c8a0602e;border-color:#c8a06054;color:var(--ink-3);box-shadow:none;cursor:default}.kaisei-btn__count{margin-left:auto;background:#ffffff2e;border-radius:999px;padding:2px 10px;font-size:13px;font-style:normal}.ranking-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;position:relative;z-index:1}.ranking-list__item{display:flex;align-items:center;gap:12px;background:#fffdf680;border:1px solid rgba(200,160,96,.27);border-radius:4px;padding:10px 14px}.ranking-list__rank{width:28px;text-align:center;font-style:italic;font-size:16px;color:var(--ink-2)}.ranking-list__city{flex:1;font-style:italic;font-size:16px;color:var(--ink);letter-spacing:.5px}.ranking-list__prefecture{font-style:normal;color:var(--ink-3);font-size:11px}.ranking-list__count{font-size:14px;color:var(--ink-2);letter-spacing:.5px}
