:root{--bg: #18181b;--bg-soft: #1f1f23;--surface: #27272a;--surface-hover: #2e2e32;--border: #3f3f46;--border-soft: #52525b;--text: #fafafa;--text-muted: #a1a1aa;--accent: #0ea5e9;--accent-hover: #38bdf8;--accent-glow: rgba(14, 165, 233, .15);--error: #f87171}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;background:linear-gradient(180deg,var(--bg) 0%,var(--bg-soft) 100%);color:var(--text);line-height:1.6;min-height:100vh}#app{max-width:960px;margin:0 auto;padding:2rem}header{margin-bottom:2rem;display:flex;align-items:center;justify-content:space-between}.header-maps-link{display:flex;align-items:center;gap:.35rem;color:var(--text-secondary);text-decoration:none;font-size:1.05rem;font-weight:700;transition:color .15s}.header-maps-link:hover{color:var(--text)}.maps-label-short{display:none}.maps-label-full{display:inline}header h1{margin:0;font-size:1.875rem;font-weight:600;letter-spacing:-.02em;display:flex;align-items:center;gap:.5rem}header .site-logo{flex-shrink:0;vertical-align:middle}.input-section{margin-bottom:2rem;display:flex;flex-direction:column;gap:.6rem;background:var(--surface);border:1px solid var(--border);border-radius:3px;padding:.8rem .85rem}.input-label{display:none;margin:0;padding-left:.2rem;font-size:.9rem;color:var(--text-muted)}.input-row{display:flex;gap:.75rem;align-items:stretch}#url-input{flex:1;min-width:0;padding:.75rem 1rem;font-size:1rem;background:var(--bg-soft);border:1px solid var(--border);border-radius:3px;color:var(--text);transition:border-color .2s,box-shadow .2s}#url-input::placeholder{color:var(--text-muted)}#url-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}#compare-btn{flex-shrink:0;padding:.75rem 1.5rem;font-size:1rem;font-weight:500;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:3px;cursor:pointer;transition:background .2s,border-color .2s,transform .1s}#compare-btn:hover{background:var(--surface-hover);border-color:var(--border-soft)}#compare-btn:active{transform:scale(.98)}#compare-btn:disabled{opacity:.6;cursor:not-allowed}.error{margin:0;line-height:1.45;font-size:.9rem;color:var(--error)}.result-section{margin-bottom:2rem}.result-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.back-btn{display:inline-flex;align-items:center;gap:.35rem;padding:.4rem .65rem .4rem .45rem;font-size:.85rem;font-weight:500;background:transparent;color:var(--text);border:none;border-radius:8px;cursor:pointer;transition:background .15s,color .15s}.back-btn:hover{background:var(--surface);color:var(--accent)}.result-actions{display:flex;align-items:center;gap:.35rem}.result-action-btn{width:2.25rem;height:2.25rem;display:inline-flex;align-items:center;justify-content:center;padding:0;background:transparent;color:var(--text-muted);border:none;border-radius:8px;cursor:pointer;transition:border-color .15s,color .15s,background .15s}.result-action-btn:hover{color:var(--accent);background:var(--surface-hover)}.result-action-btn .share-feedback,.history-item-share .share-feedback{font-size:.7rem;font-weight:500;letter-spacing:-.02em}.result-meta{font-size:1.1rem;font-weight:400;color:var(--text);padding:.65rem 0;margin-bottom:.75rem;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.result-note{margin:-.5rem 0 .75rem;font-size:.85rem;color:var(--text-muted);font-style:italic}.result-note-nearby{color:#f59e0b}.result-footer{display:flex;align-items:center;justify-content:space-between;margin-top:.75rem;padding:.65rem 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);gap:.5rem}.result-maps-link{font-size:.9rem;color:var(--accent);text-decoration:none}.result-maps-link:hover{color:var(--accent-hover);text-decoration:underline}.side-by-side{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}@media(max-width:768px){.result-section .side-by-side{grid-template-columns:1fr;gap:.5rem}}.img-wrap{position:relative;aspect-ratio:3 / 2;overflow:hidden;border-radius:8px;box-shadow:0 4px 24px #0000004d}.img-wrap img{display:block;width:100%;height:100%;object-fit:cover}.date-overlay{position:absolute;top:.35rem;right:.35rem;padding:.2rem .4rem;font-size:.7rem;font-weight:500;background:#000000b3;color:#fff;border-radius:4px}.feed-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem;position:sticky;top:0;z-index:20;background:#18181bd9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:.75rem 0;margin-top:-.75rem;border-bottom:1px solid var(--border)}.feed-controls{display:inline-flex;align-items:center;gap:.65rem}.feed-filter-control{position:relative;width:220px;max-width:32vw}.feed-filter-select-native{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.feed-filter-trigger{width:100%;min-height:2.05rem;padding:.35rem 1.9rem .35rem .65rem;font-size:.82rem;font-weight:500;text-align:left;background:var(--surface);border:1px solid var(--border);border-radius:3px;color:var(--text);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:border-color .2s,box-shadow .2s,background .2s}.feed-filter-control:after{content:"";position:absolute;right:.72rem;top:50%;width:.4rem;height:.4rem;border-right:1.5px solid var(--text-muted);border-bottom:1.5px solid var(--text-muted);transform:translateY(-62%) rotate(45deg);pointer-events:none;transition:transform .2s ease}.feed-filter-control.is-open:after{transform:translateY(-38%) rotate(-135deg)}.feed-filter-trigger:hover{background:var(--surface-hover)}.feed-filter-trigger:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.feed-filter-control.is-disabled .feed-filter-trigger{opacity:.65;cursor:not-allowed}.feed-filter-menu{position:absolute;top:calc(100% + .4rem);left:0;right:0;max-height:min(300px,45vh);overflow-y:auto;border:1px solid var(--border-soft);border-radius:3px;background:#212125;box-shadow:0 14px 28px #00000059;z-index:25;padding:.25rem}.feed-filter-option{display:block;width:100%;border:0;background:transparent;color:var(--text);text-align:left;padding:.45rem .55rem;border-radius:8px;font-size:.82rem;cursor:pointer}.feed-filter-option:hover{background:var(--surface-hover)}.feed-filter-option.is-selected{background:#0ea5e92e;color:#d9f3ff}.feed-filter-option:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent-glow)}.feed-section h2{margin:0;font-size:1.25rem;font-weight:600}#history-list.feed-list{display:flex;flex-direction:column;gap:.6rem}#history-list.feed-list.is-refreshing{opacity:.62;pointer-events:none;transition:opacity .15s ease}.history-item{display:flex;flex-direction:column;padding:0;cursor:pointer;transition:background .15s ease,border-color .15s ease;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:3px}.history-item:hover{background:var(--surface-hover);border-color:var(--border-soft)}.history-item-header{padding:.6rem .85rem}.history-thumbs{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:0}.history-thumb-wrap{position:relative;aspect-ratio:3 / 2;background:var(--bg-soft);overflow:hidden;border-radius:0}.history-thumb-wrap .thumb{width:100%;height:100%;object-fit:cover;display:block}.history-thumb-wrap .thumb-date{position:absolute;top:.3rem;right:.3rem;padding:.18rem .38rem;font-size:.68rem;font-weight:500;background:#000000b3;color:#fff;border-radius:4px}.history-item-footer{display:flex;align-items:center;justify-content:space-between;padding:.5rem .85rem .6rem;gap:.5rem}.history-item-meta{font-size:.82rem;color:var(--text-muted);min-width:0}.history-item-maps-link{font-size:.82rem;color:var(--accent);text-decoration:none}.history-item-maps-link:hover{color:var(--accent-hover);text-decoration:underline}.history-item-actions{display:flex;align-items:center;gap:.35rem;flex-shrink:0;margin-left:auto}.history-item-share,.history-item-download,.history-item-delete{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;padding:0;background:transparent;color:var(--text-muted);border:none;border-radius:50%;cursor:pointer;transition:color .15s,background .15s}.history-item-share:hover,.history-item-download:hover{color:var(--accent);background:var(--accent-glow)}.history-item-delete:hover{color:var(--error);background:#f871711f}.feed-loading{margin-top:.5rem;color:var(--text-muted);font-size:.85rem;text-align:center}.feed-see-more-btn{display:block;margin:.75rem auto 0;padding:.55rem 1rem;font-size:.9rem;font-weight:500;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:3px;cursor:pointer;transition:border-color .2s,color .2s,background .2s}.feed-see-more-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--surface-hover)}.feed-see-more-btn:disabled{opacity:.6;cursor:not-allowed}.feed-end-state{margin-top:.9rem;display:flex;flex-direction:column;align-items:center;gap:.45rem}.feed-end-text{margin:0;font-size:.9rem;color:var(--text-muted)}.feed-back-to-top-btn{padding:.5rem 1rem;font-size:.85rem;font-weight:500;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:3px;cursor:pointer;transition:border-color .2s,color .2s,background .2s}.feed-back-to-top-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--surface-hover)}.loading{opacity:.7;pointer-events:none}#compare-btn.loading{opacity:1;color:var(--text-muted);cursor:wait;display:inline-flex;align-items:center;justify-content:center;gap:.45rem}@keyframes spin{to{transform:rotate(360deg)}}#compare-btn.loading .btn-spinner{width:14px;height:14px;border:2px solid var(--border-soft);border-top-color:var(--text);border-radius:50%;animation:spin .6s linear infinite}.empty-history{padding:2rem;text-align:center;color:var(--text-muted);background:var(--surface);border:1px dashed var(--border-soft);border-radius:12px}@media(max-width:768px){#app{padding:1.25rem 1rem}header{gap:.5rem}header h1{font-size:1.6rem;gap:.35rem}header .site-logo{width:24px;height:24px}.header-maps-link{font-size:.85rem;align-self:flex-end;margin-bottom:.5rem}.header-maps-link svg{width:16px;height:16px}.maps-label-short{display:inline}.maps-label-full{display:none}.input-label{display:block}.input-section{padding:.65rem}#compare-btn{padding:.6rem .75rem;font-size:.9rem}.feed-header{align-items:flex-start;flex-direction:column;position:static;backdrop-filter:none;-webkit-backdrop-filter:none;background:transparent;border-bottom:none}.feed-controls{display:flex;flex-wrap:wrap;gap:.5rem;width:100%}.feed-controls .feed-filter-control{flex:1 1 auto;min-width:0;width:auto;max-width:none}.feed-filter-select{width:100%;max-width:none}.feed-filter-control:after{display:none}.feed-filter-trigger,.feed-filter-menu{display:none!important}.feed-filter-select-native{position:static;width:100%;height:auto;opacity:1;pointer-events:auto;min-height:2.1rem;padding:.45rem .65rem;font-size:.82rem;background:var(--surface);border:1px solid var(--border);border-radius:3px;color:var(--text);-webkit-appearance:menulist;appearance:auto}.history-thumb-wrap .thumb-date,.date-overlay{font-size:.65rem;padding:.16rem .32rem}.history-thumbs{padding:0;grid-template-columns:1fr;gap:4px}.history-item-header{padding:.45rem .6rem}.history-item-footer{display:none}.side-by-side{gap:.4rem}}