@import"https://fonts.googleapis.com/css2?family=BIZ+UDPMincho&family=Noto+Serif+JP:wght@400;700&display=swap";:root{--color-bg: #141416;--color-surface: #1c1c1e;--color-surface-hover: #2c2c2e;--color-text: #e0e0e0;--color-text-dim: #999999;--color-accent-gold: #cfad69;--color-accent-gold-hover: #e0c283;--color-accent-red: #ac2c2c;--color-accent-blue: #3b82f6;--color-border: #444444;--color-border-light: rgba(255, 255, 255, .15);--font-serif: "BIZ UDPMincho", "Noto Serif JP", "MS PMincho", serif;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Yu Gothic", "Meiryo", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;position:relative}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;box-shadow:inset 0 0 100px #0a286480,inset 0 0 40px #0a2864cc}.app-container{max-width:500px;margin:0 auto;min-height:100vh;padding:1.5rem;display:flex;flex-direction:column;gap:1.5rem}header{display:flex;flex-direction:column;gap:1rem;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--color-accent-red)}h1{font-family:var(--font-serif);font-size:1.5rem;font-weight:400;color:var(--color-accent-gold);letter-spacing:.05em}.location-toggle{display:flex;gap:.5rem;flex-wrap:wrap}.location-btn{background:transparent;border:1px solid var(--color-border);color:var(--color-text-dim);padding:.4rem .8rem;border-radius:4px;font-size:.85rem;cursor:pointer;transition:all .2s ease;font-family:var(--font-sans)}.location-btn:hover{border-color:var(--color-accent-gold);color:var(--color-text)}.location-btn.active{border-color:var(--color-accent-gold);color:var(--color-accent-gold);box-shadow:0 0 8px #cfad6933}.weather-cards{display:flex;flex-direction:column;gap:1.5rem}.weather-card-container{border:1px solid var(--color-border);border-radius:4px;padding:1.25rem 1rem 1rem;margin:.8rem 0 0;background-color:#1c1c1e80;position:relative}.weather-card-legend{position:absolute;top:-.65rem;left:.5rem;background-color:var(--color-bg);font-family:var(--font-serif);color:var(--color-accent-gold);font-size:.9rem;padding:0 .5rem;line-height:1.2}.weather-card{display:flex;justify-content:space-between;align-items:center;margin-top:.5rem}.weather-card.warm .card-diff{color:var(--color-accent-red)}.weather-card.cold .card-diff{color:var(--color-accent-blue)}.weather-card.neutral .card-diff{color:#fff}.card-diff{font-size:3rem;font-family:var(--font-serif);line-height:1;display:flex;align-items:flex-start;text-shadow:0 2px 4px rgba(0,0,0,.5)}.card-diff-unit{font-size:1.25rem;margin-top:.5rem;font-family:var(--font-sans);color:var(--color-text)}.card-info{display:flex;flex-direction:column}.card-advice{font-size:.85rem;color:var(--color-text-dim);margin-top:.5rem}.card-icon{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding-left:1rem;border-left:1px dashed var(--color-border)}.icon-wrapper{color:var(--color-accent-gold)}.card-weather-text{font-size:.8rem;color:var(--color-text)}.card-absolute-info{font-size:.75rem;color:var(--color-text-dim);margin-top:.25rem;text-align:center}.loading{display:flex;justify-content:center;align-items:center;min-height:50vh;color:var(--color-accent-gold);font-size:1rem;font-family:var(--font-serif)}.error{color:var(--color-accent-red);border:1px solid var(--color-accent-red);padding:1rem;border-radius:4px;background:#ac2c2c1a;display:flex;align-items:center;justify-content:space-between;gap:1rem}.app-footer{text-align:center;padding-top:1.5rem;display:flex;flex-direction:column;align-items:center;gap:.75rem}.ofuse-btn{display:inline-block;padding:.5rem 1.25rem;border:1px solid var(--color-accent-gold);border-radius:4px;color:var(--color-accent-gold);font-size:.85rem;text-decoration:none;transition:all .2s ease}.ofuse-btn:hover{background-color:#cfad691a;box-shadow:0 0 8px #cfad6933}.app-footer-credits{font-size:.65rem;color:var(--color-text-dim);opacity:.6}.app-footer-credits a{color:var(--color-text-dim);text-decoration:none}.app-footer-credits a:hover{color:var(--color-accent-gold);text-decoration:underline}.flex-row{display:flex;flex-direction:row}.flex-col{display:flex;flex-direction:column}.justify-space-between{justify-content:space-between}.justify-center{justify-content:center}.items-center{align-items:center}.gap-sm{gap:.5rem}.gap-md{gap:1rem}.gap-lg{gap:1.5rem}.w-full{width:100%}.h-full{height:100%}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.text-center{text-align:center}.text-left{text-align:left}.text-ellipsis{text-overflow:ellipsis}.whitespace-nowrap{white-space:nowrap}.p-sm{padding:.5rem}.pt-lg{padding-top:1.5rem}.mt-sm{margin-top:.5rem}.mt-md{margin-top:1rem}.mt-lg{margin-top:1.5rem}.my-md{margin-top:1rem;margin-bottom:1rem}.font-bold{font-weight:700}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.text-primary{color:var(--color-accent-gold)}.text-danger{color:var(--color-accent-red)}.text-muted{color:var(--color-text-dim)}.bg-surface{background:var(--color-surface)}.hover-bg:hover{background:var(--color-surface-hover)}.border-radius-sm{border-radius:4px}.border{border:1px solid var(--color-border)}.border-top{border-top:1px dashed var(--color-border)}.border-bottom{border-bottom:1px dashed var(--color-border)}.overflow-hidden{overflow:hidden}.cursor-pointer{cursor:pointer}.header-top{display:flex;justify-content:space-between;align-items:center;width:100%}.settings-toggle-btn{background:transparent;border:1px solid var(--color-border);border-radius:4px;color:var(--color-text-dim);cursor:pointer;padding:.25rem .5rem;font-size:.8rem;transition:all .2s;display:flex;align-items:center;gap:.25rem}.settings-toggle-btn:hover{border-color:var(--color-accent-gold);color:var(--color-accent-gold)}.settings-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000c;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:100;display:flex;justify-content:center;align-items:center}.settings-modal{background-color:var(--color-bg);width:100%;max-width:500px;height:auto;max-height:85vh;border:1px solid var(--color-border);border-radius:4px;padding:1.5rem;display:flex;flex-direction:column;box-shadow:0 0 20px #000c}.settings-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;border-bottom:1px dashed var(--color-accent-red);padding-bottom:.5rem}.settings-header h2{font-size:1.1rem;font-family:var(--font-serif);color:var(--color-accent-gold)}.close-btn{background:transparent;border:none;color:var(--color-text-dim);cursor:pointer}.close-btn:hover{color:var(--color-text)}.settings-content{overflow-y:auto;flex:1}.btn-icon{background:transparent;border:none;cursor:pointer;padding:.25rem;display:flex;align-items:center;justify-content:center;border-radius:4px;color:var(--color-text-dim)}.btn-icon:hover{color:var(--color-accent-gold)}.btn-icon.text-danger:hover{color:var(--color-accent-red)}.btn-primary{background-color:transparent;color:var(--color-accent-gold);border:1px solid var(--color-accent-gold);padding:.5rem 1rem;border-radius:4px;font-size:.9rem;cursor:pointer;transition:all .2s;display:flex;justify-content:center;align-items:center}.btn-primary:hover{background-color:#cfad691a;box-shadow:0 0 8px #cfad6933}.btn-primary:disabled{border-color:var(--color-border);color:var(--color-border);cursor:not-allowed;box-shadow:none;background-color:transparent}.btn-secondary{background-color:transparent;color:var(--color-text);border:1px solid var(--color-border);padding:.5rem 1rem;border-radius:4px;font-size:.9rem;cursor:pointer;transition:all .2s}.btn-secondary:hover:not(:disabled){border-color:#888}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.input-text{background-color:#000;color:var(--color-text);border:1px solid var(--color-border);padding:.5rem .75rem;border-radius:4px;font-family:inherit;font-size:.9rem}.input-text:focus{outline:none;border-color:var(--color-accent-gold);box-shadow:0 0 4px #cfad694d}.settings-fieldset{border:1px solid var(--color-border);border-radius:4px;padding:1.25rem 1rem 1rem;margin-top:.8rem;margin-bottom:1.5rem;position:relative}.settings-legend{position:absolute;top:-.65rem;left:.5rem;background-color:var(--color-bg);font-family:var(--font-serif);color:var(--color-accent-red);font-size:.9rem;padding:0 .5rem;line-height:1.2}
