:root {
  --bg: #0d1117; --bg2: #161b22; --bg3: #21262d;
  --text: #e6edf3; --text2: #8b949e; --accent: #58a6ff;
  --accent2: #3fb950; --border: #30363d; --card: #1c2128;
  --shadow: 0 4px 24px rgba(0,0,0,0.4);
}
[data-theme="light"] {
  --bg: #f0f2f5; --bg2: #ffffff; --bg3: #e8ecf0;
  --text: #1a1a2e; --text2: #555; --accent: #0066cc;
  --accent2: #28a745; --border: #d0d7de; --card: #fff;
  --shadow: 0 4px 24px rgba(0,0,0,0.1);
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: -apple-system,BlinkMacSystemFont,Segoe UI,sans-serif; background:var(--bg); color:var(--text); min-height:100vh; }
.overlay { position:fixed; inset:0; background:linear-gradient(135deg,#0d1117,#1a237e,#0d1117); display:flex; align-items:center; justify-content:center; z-index:1000; }
.login-box { background:var(--bg2); border:1px solid var(--border); border-radius:20px; padding:48px 40px; text-align:center; max-width:400px; width:90%; box-shadow:var(--shadow); }
.login-box h1 { font-size:2.2rem; font-weight:700; color:var(--text); margin-bottom:8px; }
.login-box h1 span { color:var(--accent); }
.tagline { color:var(--text2); margin-bottom:32px; font-size:0.95rem; }
.google-btn { display:flex; align-items:center; gap:12px; background:#fff; color:#333; border:1px solid #ddd; border-radius:8px; padding:12px 24px; font-size:1rem; cursor:pointer; width:100%; justify-content:center; transition:all 0.2s; }
.google-btn:hover { box-shadow:0 2px 8px rgba(0,0,0,0.2); transform:translateY(-1px); }
.hint { color:var(--text2); font-size:0.8rem; margin-top:16px; }
header { background:var(--bg2); border-bottom:1px solid var(--border); padding:12px 20px; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:100; }
.header-left { display:flex; align-items:center; gap:16px; }
.hamburger { font-size:1.4rem; cursor:pointer; color:var(--text2); padding:4px 8px; border-radius:6px; }
.hamburger:hover { background:var(--bg3); }
.brand { font-size:1.3rem; font-weight:700; }
.brand span { color:var(--accent); }
.header-right { display:flex; align-items:center; gap:16px; }
.theme-toggle { background:none; border:1px solid var(--border); border-radius:8px; padding:6px 10px; cursor:pointer; font-size:1rem; }
.lang-switch { display:flex; align-items:center; gap:6px; }
.lang-switch button { background:none; border:none; color:var(--text2); cursor:pointer; font-size:0.9rem; font-weight:600; padding:4px 8px; border-radius:4px; }
.lang-switch button.active { color:var(--accent); background:rgba(88,166,255,0.1); }
.lang-switch span { color:var(--border); }
.user-info { font-size:0.85rem; color:var(--text2); }
.main-layout { display:flex; height:calc(100vh - 57px); }
.sidebar { width:220px; background:var(--bg2); border-right:1px solid var(--border); padding:16px 0; transition:transform 0.3s; flex-shrink:0; }
.sidebar.hidden { transform:translateX(-220px); margin-left:-220px; }
nav { display:flex; flex-direction:column; }
.nav-item { display:block; padding:12px 20px; color:var(--text2); text-decoration:none; font-size:0.9rem; border-left:3px solid transparent; transition:all 0.2s; }
.nav-item:hover,.nav-item.active { color:var(--accent); background:rgba(88,166,255,0.08); border-left-color:var(--accent); }
.content { flex:1; overflow-y:auto; padding:28px; }
.section { display:none; }
.section.active { display:block; }
.hero { max-width:800px; margin:0 auto; text-align:center; padding:40px 20px; }
.hero h2 { font-size:2.2rem; font-weight:700; margin-bottom:16px; }
.hero p { color:var(--text2); font-size:1.1rem; margin-bottom:40px; }
.feature-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:20px; margin-bottom:40px; text-align:left; }
.feature-card { background:var(--card); border:1px solid var(--border); border-radius:12px; padding:20px; transition:transform 0.2s,border-color 0.2s; }
.feature-card:hover { transform:translateY(-3px); border-color:var(--accent); }
.feature-icon { font-size:2rem; margin-bottom:12px; }
.feature-card h3 { font-size:0.95rem; margin-bottom:8px; }
.feature-card p { color:var(--text2); font-size:0.85rem; }
.cta-btn { background:var(--accent); color:#fff; border:none; border-radius:10px; padding:14px 32px; font-size:1rem; cursor:pointer; font-weight:600; transition:all 0.2s; }
.cta-btn:hover { opacity:0.85; transform:translateY(-2px); }
.upload-area { border:2px dashed var(--border); border-radius:16px; padding:48px 20px; text-align:center; cursor:pointer; transition:all 0.2s; margin-bottom:24px; }
.upload-area:hover { border-color:var(--accent); background:rgba(88,166,255,0.04); }
.upload-icon { font-size:3rem; margin-bottom:16px; }
.upload-hint { color:var(--text2); font-size:0.85rem; margin-top:8px; }
.file-list { display:flex; flex-direction:column; gap:8px; margin-bottom:24px; }
.file-item { background:var(--card); border:1px solid var(--border); border-radius:8px; padding:12px 16px; display:flex; align-items:center; gap:12px; font-size:0.9rem; }
.file-item .remove { margin-left:auto; cursor:pointer; color:var(--text2); }
.addr-section { background:var(--card); border:1px solid var(--border); border-radius:12px; padding:24px; }
.addr-section label { display:block; margin-bottom:8px; font-size:0.9rem; color:var(--text2); }
.addr-input { width:100%; background:var(--bg3); border:1px solid var(--border); border-radius:8px; padding:10px 14px; color:var(--text); font-size:0.95rem; margin-bottom:16px; }
.addr-input:focus { outline:none; border-color:var(--accent); }
.analyze-btn { background:linear-gradient(135deg,var(--accent),#a371f7); color:#fff; border:none; border-radius:8px; padding:12px 28px; font-size:0.95rem; cursor:pointer; font-weight:600; transition:all 0.2s; }
.analyze-btn:hover { opacity:0.9; transform:translateY(-1px); }
.viewer-controls { display:flex; gap:10px; margin-bottom:16px; flex-wrap:wrap; }
.viewer-controls button { background:var(--card); border:1px solid var(--border); color:var(--text); border-radius:8px; padding:8px 16px; cursor:pointer; font-size:0.85rem; }
.viewer-controls button:hover { border-color:var(--accent); color:var(--accent); }
#threejs-container { width:100%; height:500px; background:var(--card); border:1px solid var(--border); border-radius:12px; overflow:hidden; position:relative; }
.viewer-info { margin-top:16px; color:var(--text2); text-align:center; padding:16px; }
.map-controls { display:flex; gap:12px; margin-bottom:16px; }
.map-controls .addr-input { margin-bottom:0; flex:1; }
#mapBtn { background:var(--accent); color:#fff; border:none; border-radius:8px; padding:10px 20px; cursor:pointer; font-size:0.9rem; white-space:nowrap; }
#map-container { width:100%; height:500px; border-radius:12px; overflow:hidden; border:1px solid var(--border); }
#map-container iframe { width:100%; height:100%; border:none; }
.analysis-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:20px; }
.analysis-card { background:var(--card); border:1px solid var(--border); border-radius:12px; padding:20px; }
.analysis-card h3 { margin-bottom:16px; font-size:1rem; }
.raw-text { color:var(--text2); font-size:0.85rem; line-height:1.7; white-space:pre-wrap; max-height:300px; overflow-y:auto; }
.no-results { text-align:center; padding:60px 20px; color:var(--text2); }
.loading-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.8); display:flex; align-items:center; justify-content:center; z-index:2000; }
.loading-box { background:var(--bg2); border:1px solid var(--border); border-radius:16px; padding:48px; text-align:center; }
.spinner { width:48px; height:48px; border:4px solid var(--border); border-top-color:var(--accent); border-radius:50%; animation:spin 0.8s linear infinite; margin:0 auto 24px; }
@keyframes spin { to { transform:rotate(360deg); } }
.loading-sub { color:var(--text2); font-size:0.85rem; margin-top:8px; }
.tag { display:inline-block; background:rgba(88,166,255,0.15); color:var(--accent); border-radius:4px; padding:2px 8px; font-size:0.8rem; margin:2px; }
h2 { font-size:1.6rem; margin-bottom:8px; }
h2+p { color:var(--text2); margin-bottom:24px; }