:root{--bg-primary:#faf6f0;--bg-secondary:#f3ece3;--bg-card:#fff;--text-main:#3e3835;--text-muted:#8a7e78;--border-color:#ede6dc;--accent-rose:#d9a091;--accent-rose-hover:#c58c7e;--accent-rose-light:#fbf0ed;--accent-sage:#9ab0a1;--accent-sage-hover:#89a090;--accent-sage-light:#f0f5f1;--accent-gold:#c5a059;--accent-gold-light:#f7f2e8;--shadow-sm:0 4px 12px #3e383508;--shadow-md:0 8px 24px #3e38350f;--shadow-lg:0 16px 36px #3e38351a;--shadow-inset:inset 0 2px 4px #00000005;--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--radius-pill:9999px;--font-serif:"Playfair Display", "Noto Serif JP", Georgia, serif;--font-sans:"Outfit", "Noto Sans JP", "Hiragino Kaku Gothic ProN", sans-serif;--transition-normal:all .3s cubic-bezier(.4, 0, .2, 1);--transition-smooth:all .5s cubic-bezier(.16, 1, .3, 1);--transition-spring:all .4s cubic-bezier(.175, .885, .32, 1.275)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}body{font-family:var(--font-sans);color:var(--text-main);background-color:var(--bg-primary);font-size:15px;line-height:1.6;overflow-x:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}#root{background-color:var(--bg-primary);flex-direction:column;width:100%;max-width:480px;height:100vh;margin:0 auto;display:flex;position:relative;overflow:hidden;box-shadow:0 0 32px #3e38350d}@keyframes fadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse-subtle{0%,to{opacity:1}50%{opacity:.6}}.animate-fade-in{animation:.4s cubic-bezier(.16,1,.3,1) forwards fadeInUp}.animate-scale-in{animation:.3s cubic-bezier(.16,1,.3,1) forwards scaleIn}input,select,textarea{color:var(--text-main);background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-sm);transition:var(--transition-normal);outline:none;padding:10px 14px;font-family:inherit;font-size:14px}input:focus,select:focus,textarea:focus{border-color:var(--accent-rose);box-shadow:0 0 0 3px #d9a09126}button{cursor:pointer;transition:var(--transition-normal);background:0 0;border:none;outline:none;font-family:inherit}button:active{transform:scale(.96)}.app-container{flex-direction:column;height:100vh;display:flex;position:relative;overflow:hidden}.app-header{text-align:center;background-color:var(--bg-primary);border-bottom:1px solid var(--border-color);width:100%;box-shadow:var(--shadow-sm);z-index:110;margin:0;padding:10px 16px;position:relative}.app-header h1{font-family:var(--font-serif);color:var(--text-main);letter-spacing:2px;margin-bottom:2px;font-size:20px;font-weight:600}.app-header .subtitle{font-family:var(--font-sans);text-transform:uppercase;letter-spacing:2px;color:var(--accent-rose);font-size:10px;font-weight:600}.app-header:after{display:none}.app-header-gps{border-radius:var(--radius-pill);z-index:10;align-items:center;gap:4px;padding:2px 6px;font-size:9px;font-weight:600;display:flex;position:absolute;top:13px;right:16px}.card{background-color:var(--bg-card);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--border-color);transition:var(--transition-normal);margin-bottom:16px;padding:16px}.card:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}.countdown-card{background:linear-gradient(135deg, var(--accent-gold-light) 0%, #faf2e5 100%);text-align:center;border:1px solid #c5a05933;position:relative;overflow:hidden}.countdown-card:before{content:"";pointer-events:none;background:#c5a0591a;border-radius:50%;width:100px;height:100px;position:absolute;top:-50px;right:-50px}.countdown-title{color:var(--accent-gold);letter-spacing:1px;margin-bottom:4px;font-size:13px;font-weight:600}.countdown-days{font-family:var(--font-serif);color:var(--text-main);font-size:32px;font-weight:700}.countdown-days span{font-size:16px;font-family:var(--font-sans);margin-left:4px;font-weight:500}.bottom-nav{-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--border-color);z-index:100;background-color:#ffffffd9;justify-content:space-around;width:100%;max-width:480px;padding:10px 10px 24px;display:flex;position:fixed;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 -4px 20px #3e38350d}.nav-item{color:var(--text-muted);transition:var(--transition-normal);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:4px;font-size:10px;font-weight:500;display:flex}.nav-item svg{width:22px;height:22px;transition:var(--transition-spring)}.nav-item.active{color:var(--accent-rose)}.nav-item.active svg{stroke:var(--accent-rose);transform:translateY(-2px)}.tab-content{-webkit-overflow-scrolling:touch;flex:1;padding:16px 16px 90px;animation:.4s cubic-bezier(.16,1,.3,1) forwards fadeInUp;overflow-y:auto}.day-selector{background-color:var(--bg-secondary);border-radius:var(--radius-pill);border:1px solid var(--border-color);margin-bottom:20px;padding:4px;display:flex}.day-tab{text-align:center;border-radius:var(--radius-pill);color:var(--text-muted);transition:var(--transition-normal);flex:1;padding:8px 4px;font-size:13px;font-weight:600}.day-tab.active{background-color:var(--bg-card);color:var(--text-main);box-shadow:var(--shadow-sm)}.timeline{padding-left:24px;position:relative}.timeline:before{content:"";background-color:var(--border-color);width:2px;position:absolute;top:8px;bottom:8px;left:7px}.timeline-item{margin-bottom:24px;animation:.3s cubic-bezier(.16,1,.3,1) forwards fadeInUp;position:relative}.timeline-item:before{content:"";background-color:var(--bg-card);border:3px solid var(--accent-rose);z-index:2;width:14px;height:14px;box-shadow:0 0 0 4px var(--bg-primary);transition:var(--transition-normal);border-radius:50%;position:absolute;top:6px;left:-24px}.timeline-item:hover:before{background-color:var(--accent-rose);transform:scale(1.2)}.timeline-time{color:var(--accent-rose);margin-bottom:4px;font-family:Outfit,sans-serif;font-size:13px;font-weight:600;display:inline-block}.timeline-card{background-color:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:14px;position:relative}.timeline-card-header{justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:6px;display:flex}.timeline-title{color:var(--text-main);font-size:15px;font-weight:600}.timeline-distance{color:var(--accent-sage);background-color:var(--accent-sage-light);border-radius:var(--radius-pill);align-items:center;gap:4px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-flex}.timeline-distance.near{color:var(--accent-rose);background-color:var(--accent-rose-light);animation:2s ease-in-out infinite pulse-subtle}.timeline-notes{color:var(--text-muted);white-space:pre-wrap;font-size:13px;line-height:1.4}.timeline-actions{border-top:1px solid var(--border-color);justify-content:flex-end;gap:12px;margin-top:10px;padding-top:8px;display:flex}.timeline-btn{color:var(--text-muted);align-items:center;gap:4px;font-size:12px;display:inline-flex}.timeline-btn:hover{color:var(--accent-rose)}.timeline-btn.delete:hover{color:#d9534f}.badge{border-radius:var(--radius-pill);text-transform:uppercase;letter-spacing:.5px;padding:2px 8px;font-size:10px;font-weight:600;display:inline-block}.badge-sightseeing{background-color:var(--accent-sage-light);color:var(--accent-sage)}.badge-gourmet{background-color:var(--accent-rose-light);color:var(--accent-rose)}.badge-shopping{background-color:var(--accent-gold-light);color:var(--accent-gold)}.badge-hotel{background-color:var(--bg-secondary);color:var(--text-muted)}.badge-other{color:#546e7a;background-color:#eceff1}.weather-container{grid-template-columns:1fr 1fr;gap:12px;display:grid}.weather-box{background-color:var(--bg-card);border-radius:var(--radius-md);text-align:center;border:1px solid var(--border-color);padding:12px}.weather-box h3{color:var(--text-muted);margin-bottom:6px;font-size:13px;font-weight:600}.weather-temp{color:var(--text-main);margin-bottom:4px;font-family:Outfit,sans-serif;font-size:20px;font-weight:700}.weather-info{color:var(--text-muted);justify-content:center;align-items:center;gap:4px;font-size:11px;display:flex}.weather-icon{margin-bottom:4px;font-size:24px}.calc-container{background-color:var(--bg-card);border-radius:var(--radius-md);border:1px solid var(--border-color);padding:16px}.calc-title{align-items:center;gap:6px;margin-bottom:12px;font-size:14px;font-weight:600;display:flex}.calc-inputs{flex-direction:column;gap:12px;display:flex}.calc-row{align-items:center;gap:10px;display:flex}.calc-row span{width:48px;color:var(--text-muted);font-size:13px;font-weight:600}.calc-input-wrapper{flex:1;position:relative}.calc-input-wrapper input{width:100%;padding-right:36px;font-family:Outfit,sans-serif;font-size:16px;font-weight:600}.calc-unit{color:var(--text-muted);font-size:13px;font-weight:600;position:absolute;top:50%;right:12px;transform:translateY(-50%)}.calc-shortcut-grid{grid-template-columns:repeat(4,1fr);gap:6px;margin-top:12px;display:grid}.calc-shortcut-btn{background-color:var(--bg-secondary);color:var(--text-main);border-radius:var(--radius-sm);text-align:center;padding:6px 0;font-size:12px;font-weight:600}.calc-shortcut-btn:hover{background-color:var(--accent-rose-light);color:var(--accent-rose)}.calc-rate-info{color:var(--text-muted);text-align:right;margin-top:8px;font-size:10px}.modal-overlay{-webkit-backdrop-filter:blur(4px);z-index:200;background-color:#3e383566;justify-content:center;align-items:flex-end;width:100%;max-width:480px;height:100%;display:flex;position:fixed;top:0;left:50%;transform:translate(-50%)}.modal-content{background-color:var(--bg-card);border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg);flex-direction:column;width:100%;max-height:85vh;padding:24px 20px 40px;animation:.3s cubic-bezier(.16,1,.3,1) forwards slideUp;display:flex;box-shadow:0 -8px 32px #0000001a}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.modal-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.modal-title{font-family:var(--font-sans);font-size:18px;font-weight:700}.modal-close{color:var(--text-muted);padding:4px}.modal-body{flex:1;padding-bottom:20px;overflow-y:auto}.modal-spot-list{flex-direction:column;gap:10px;display:flex}.modal-spot-card{border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-normal);justify-content:space-between;align-items:center;padding:12px;display:flex}.modal-spot-card:hover{border-color:var(--accent-rose);background-color:var(--accent-rose-light)}.modal-spot-info h4{margin-bottom:2px;font-size:14px;font-weight:600}.modal-spot-info p{color:var(--text-muted);font-size:11px}.btn-primary{background-color:var(--accent-rose);color:#fff;border-radius:var(--radius-md);justify-content:center;align-items:center;gap:8px;width:100%;padding:12px;font-size:14px;font-weight:600;display:flex;box-shadow:0 4px 12px #d9a0914d}.btn-primary:hover{background-color:var(--accent-rose-hover)}.btn-secondary{background-color:var(--bg-secondary);color:var(--text-main);border-radius:var(--radius-md);justify-content:center;align-items:center;gap:8px;width:100%;padding:12px;font-size:14px;font-weight:600;display:flex}.btn-secondary:hover{background-color:var(--border-color)}.btn-add-floating{background-color:var(--accent-rose);color:#fff;z-index:10;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;display:flex;position:absolute;bottom:90px;right:20px;box-shadow:0 8px 24px #d9a09166}.btn-add-floating:hover{background-color:var(--accent-rose-hover);transform:scale(1.08)rotate(90deg)}.form-group{flex-direction:column;gap:6px;margin-bottom:16px;display:flex}.form-group label{color:var(--text-muted);font-size:12px;font-weight:600}.spots-grid{flex-direction:column;gap:12px;display:flex}.spot-card-detail{border:1px solid var(--border-color);border-radius:var(--radius-md);background-color:var(--bg-card);transition:var(--transition-normal);padding:14px;position:relative}.spot-card-detail:hover{box-shadow:var(--shadow-md)}.spot-card-header{justify-content:space-between;align-items:flex-start;margin-bottom:6px;display:flex}.spot-card-title{font-size:15px;font-weight:600}.spot-card-meta{align-items:center;gap:6px;margin-bottom:8px;display:flex}.spot-card-notes{color:var(--text-muted);background-color:var(--bg-secondary);border-radius:var(--radius-sm);margin-bottom:10px;padding:8px 10px;font-size:12px}.map-iframe-container{border-radius:var(--radius-md);border:1px solid var(--border-color);background-color:var(--bg-secondary);width:100%;height:0;margin-bottom:16px;padding-bottom:60%;position:relative;overflow:hidden}.map-iframe-container iframe{border:0;width:100%;height:100%;position:absolute;top:0;left:0}.search-container{margin-bottom:16px;position:relative}.search-input{width:100%;padding-left:36px}.search-icon{color:var(--text-muted);width:16px;height:16px;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.location-status{color:var(--text-muted);background-color:var(--bg-secondary);border-radius:var(--radius-sm);align-items:center;gap:8px;margin-bottom:12px;padding:8px 12px;font-size:12px;display:flex}.location-status-dot{border-radius:50%;width:8px;height:8px}.location-status-dot.active{background-color:var(--accent-sage);animation:1.5s infinite pulse-subtle}.location-status-dot.inactive{background-color:#d9534f}.spots-scroll-container{max-height:calc(100vh - 340px);margin-top:12px;padding-right:4px;overflow-y:auto}.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}