* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,sans-serif; background:linear-gradient(135deg,#0f0c29,#302b63,#24243e); color:#e0e0e0; min-height:100vh; line-height:1.6; }
.container { max-width:1000px; margin:0 auto; padding:2rem 1rem; }
header { text-align:center; margin-bottom:1.5rem; }
header h1 { font-size:2.5rem; background:linear-gradient(90deg,#ff6b6b,#feca57,#48dbfb); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.subtitle { color:#888; margin-top:.5rem; }
.tabs { display:flex; gap:.5rem; margin-bottom:1.5rem; border-bottom:1px solid rgba(255,255,255,.12); overflow-x:auto; }
.tab-btn { padding:.7rem 1.1rem; background:transparent; border:none; border-bottom:2px solid transparent; color:#aaa; font-size:.95rem; cursor:pointer; white-space:nowrap; }
.tab-btn:hover { color:#fff; }
.tab-btn.active { color:#fff; border-bottom-color:#48dbfb; }
.tab-panel { display:none; }
.tab-panel.active { display:block; }
.weather-widget,.content,.tool-panel { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:16px; padding:1.5rem; margin-bottom:2rem; backdrop-filter:blur(10px); }
.weather-header { display:flex; align-items:center; gap:.75rem; margin-bottom:1.5rem; flex-wrap:wrap; }
.weather-header h2 { font-size:1.25rem; margin-right:auto; }
#city-input { flex:1; min-width:150px; padding:.5rem .75rem; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); border-radius:8px; color:#e0e0e0; font-size:.95rem; }
#city-input::placeholder { color:#666; }
#search-btn,.tool-action { padding:.55rem 1rem; background:linear-gradient(135deg,#667eea,#764ba2); border:none; border-radius:8px; color:white; font-size:.95rem; cursor:pointer; }
#search-btn:hover,.tool-action:hover { opacity:.85; }
.tool-action.secondary { background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.15); }
.weather-content { text-align:center; }
.weather-loading { color:#888; padding:2rem 0; }
.weather-main { display:flex; align-items:center; justify-content:center; gap:1rem; margin-bottom:1rem; }
.weather-icon { font-size:3rem; }
.weather-temp { font-size:3rem; font-weight:300; }
.weather-desc { color:#aaa; font-size:1.1rem; margin-bottom:.5rem; }
.weather-location { color:#888; font-size:.95rem; }
.weather-details { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:1rem; margin-top:1.5rem; }
.weather-detail { background:rgba(255,255,255,.05); border-radius:10px; padding:.75rem; }
.weather-detail-label { font-size:.8rem; color:#888; text-transform:uppercase; letter-spacing:.5px; }
.weather-detail-value { font-size:1.1rem; margin-top:.25rem; }
.weather-error { color:#ff6b6b; padding:1rem 0; }
.content h2 { margin-bottom:.75rem; }
.content p { color:#bbb; margin-bottom:.5rem; }
.books-section { min-height:300px; }
.book-card { display:flex; align-items:center; gap:1.5rem; margin-top:1.25rem; }
.book-cover { width:160px; max-width:42%; height:auto; border-radius:6px; box-shadow:0 8px 24px rgba(0,0,0,.35); }
.book-info h3 { margin-bottom:.25rem; }
.book-author { color:#aaa; }
.tools-intro,.games-intro { margin-bottom:1.25rem; }
.tool-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:.9rem; margin-bottom:1.5rem; }
.tool-card { text-align:left; padding:1rem; min-height:145px; border-radius:14px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.06); color:#eee; cursor:pointer; transition:transform .15s,border-color .15s,background .15s; }
.tool-card:hover { transform:translateY(-2px); border-color:rgba(72,219,251,.5); background:rgba(255,255,255,.09); }
.tool-card strong { display:block; font-size:1rem; margin:.5rem 0 .25rem; }
.tool-card>span:last-child { display:block; color:#999; font-size:.82rem; line-height:1.4; }
.tool-icon { font-size:1.35rem; color:#48dbfb; font-weight:600; }
.tool-panel { display:none; }
.tool-panel.active { display:block; }
.tool-panel-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:1.2rem; }
.tool-panel-header h3 { font-size:1.2rem; }
.close-tool { background:transparent; color:#aaa; border:1px solid rgba(255,255,255,.15); border-radius:7px; padding:.4rem .7rem; cursor:pointer; }
.tool-form { display:grid; gap:1rem; }
.two-col { grid-template-columns:repeat(2,minmax(0,1fr)); }
.tool-form label { display:flex; flex-direction:column; gap:.35rem; color:#aaa; font-size:.85rem; }
.tool-form input,.tool-form select,.tool-textarea { width:100%; padding:.65rem .75rem; border-radius:8px; border:1px solid rgba(255,255,255,.15); background:rgba(0,0,0,.2); color:#eee; font:inherit; }
.tool-form select option { background:#24243e; color:#eee; }
.tool-textarea { min-height:220px; resize:vertical; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.tool-textarea.output { margin-top:1rem; }
.tool-actions { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.tool-result { margin-top:1rem; padding:1rem; min-height:48px; border-radius:10px; background:rgba(0,0,0,.18); color:#ddd; }
.tool-result.error { color:#ff8b8b; }
.tool-result.success { color:#9ee7b1; }
.tool-result code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.result-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:.6rem 1rem; }
.result-item span { display:block; color:#888; font-size:.78rem; }
.result-item strong { font-weight:500; }
.password-result { word-break:break-all; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:1.05rem; user-select:all; }
.game-project-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin-top:1.25rem; }
.game-project { padding:1.25rem; border-radius:14px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.05); }
.game-project-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.75rem; }
.game-icon { font-size:1.7rem; }
.project-status { padding:.3rem .6rem; border-radius:999px; background:rgba(254,202,87,.12); border:1px solid rgba(254,202,87,.25); color:#feca57; font-size:.72rem; text-transform:uppercase; letter-spacing:.5px; white-space:nowrap; }
.game-project h3 { font-size:1.15rem; margin-bottom:.4rem; }
.game-project p { color:#aaa; font-size:.9rem; }
.project-meta { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.project-meta span { color:#888; font-size:.75rem; padding:.3rem .5rem; border-radius:6px; background:rgba(0,0,0,.18); }
.project-placeholder { margin-top:1rem; padding:.75rem; border:1px dashed rgba(255,255,255,.18); border-radius:8px; color:#777; font-size:.8rem; text-align:center; }
.section-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; margin-bottom:1.25rem; }
.section-subtitle { color:#888; font-size:.85rem; }
.mock-badge { color:#feca57; border:1px solid rgba(254,202,87,.3); background:rgba(254,202,87,.1); padding:.3rem .55rem; border-radius:6px; font-size:.7rem; font-weight:600; letter-spacing:.5px; white-space:nowrap; }
.activity-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:.8rem; margin-bottom:1rem; }
.activity-card { padding:1rem; border-radius:12px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1); }
.activity-card span,.activity-card small { display:block; color:#888; font-size:.75rem; }
.activity-card strong { display:block; font-size:1.8rem; margin:.2rem 0; font-weight:500; }
.dashboard-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.dashboard-card { padding:1.2rem; border-radius:14px; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.1); margin-top:1rem; }
.dashboard-card h3 { margin-bottom:1rem; font-size:1.05rem; }
.stat-list>div,.calendar-list>div { display:flex; justify-content:space-between; gap:1rem; padding:.7rem 0; border-bottom:1px solid rgba(255,255,255,.07); }
.stat-list>div:last-child,.calendar-list>div:last-child { border-bottom:none; }
.stat-list span,.calendar-list span { color:#aaa; font-size:.85rem; }
.stat-list strong { font-size:.8rem; font-weight:500; text-align:right; }
.calendar-list time { color:#48dbfb; font-size:.78rem; min-width:105px; }
.dashboard-note { color:#777 !important; font-size:.75rem; margin-top:.9rem; }
.recent-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.7rem; }
.recent-grid>div { padding:.8rem; border-radius:9px; background:rgba(0,0,0,.15); }
.recent-grid strong,.recent-grid span { display:block; }
.recent-grid strong { font-size:.85rem; }
.recent-grid span { color:#777; font-size:.72rem; margin-top:.25rem; }
footer { text-align:center; color:#555; font-size:.85rem; }
@media (max-width:800px) {
    .tool-grid { grid-template-columns:repeat(2,1fr); }
    .game-project-grid,.dashboard-grid { grid-template-columns:1fr; }
    .activity-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:600px) {
    header h1 { font-size:1.8rem; }
    .weather-temp { font-size:2.5rem; }
    .weather-details { grid-template-columns:1fr 1fr; }
    .book-card { align-items:flex-start; }
    .book-cover { width:120px; }
    .two-col { grid-template-columns:1fr; }
    .section-heading { align-items:flex-start; }
    .recent-grid { grid-template-columns:1fr; }
}
@media (max-width:420px) {
    .tool-grid { grid-template-columns:1fr; }
    .activity-grid { grid-template-columns:1fr 1fr; }
}
/* SDR image opportunity planner */
.sdr-section{overflow:hidden}.sdr-refresh{padding:.5rem .85rem;border-radius:8px;border:1px solid rgba(72,219,251,.25);background:rgba(72,219,251,.08);color:#bcefff;cursor:pointer}.sdr-location{color:#999;font-size:.78rem;margin:-.55rem 0 1rem}.sdr-status{color:#999;font-size:.78rem;padding:.65rem .8rem;border-radius:8px;background:rgba(0,0,0,.14);margin-bottom:1rem}.sdr-status.ready{color:#9ee7b1}.sdr-status.error{color:#ff9b9b}.sdr-next-card{padding:1rem 1.1rem;border-radius:12px;border:1px solid rgba(72,219,251,.2);background:rgba(72,219,251,.06);margin-bottom:1rem}.sdr-next-card span,.sdr-next-card small{display:block;color:#888;font-size:.75rem}.sdr-next-card strong{display:block;font-size:1.2rem;margin:.2rem 0}.sdr-next-card div{color:#bbb;font-size:.85rem}.sdr-target-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.sdr-card{padding:1rem;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04)}.sdr-card.featured{border-color:rgba(72,219,251,.3)}.sdr-card-top{display:flex;justify-content:space-between}.sdr-rank{color:#48dbfb;font-size:.75rem;font-weight:600}.sdr-rating{color:#feca57;font-size:.7rem;text-transform:uppercase}.sdr-card h3{margin:.35rem 0 .15rem;font-size:1rem}.sdr-time{color:#bbb!important;font-size:.8rem;margin:0 0 .7rem!important}.sdr-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:.45rem;margin-bottom:.7rem}.sdr-metrics span{padding:.45rem;border-radius:7px;background:rgba(0,0,0,.15)}.sdr-metrics small,.sdr-metrics b{display:block}.sdr-metrics small{color:#777;font-size:.65rem}.sdr-metrics b{font-size:.8rem;font-weight:500}.sdr-frequency{color:#aaa!important;font-size:.75rem;margin:0!important}.sdr-hardware{color:#777!important;font-size:.7rem;margin:.2rem 0 0!important}.sdr-loading,.sdr-empty{padding:1.25rem;border-radius:10px;background:rgba(0,0,0,.14);color:#888;font-size:.82rem}.sdr-details{margin-top:1rem;color:#888;font-size:.78rem}.sdr-details summary{cursor:pointer;color:#aaa}.sdr-source{margin-top:1rem!important;color:#666!important;font-size:.7rem}@media(max-width:700px){.sdr-target-grid{grid-template-columns:1fr}}

.activity-heading-actions{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap}
.dashboard-customize{padding:.45rem .75rem;border-radius:8px;border:1px solid rgba(72,219,251,.28);background:rgba(72,219,251,.08);color:#bcefff;cursor:pointer;font-size:.78rem}
.dashboard-customize:hover{background:rgba(72,219,251,.14)}
.dashboard-customizer{margin:-.35rem 0 1rem;padding:1rem;border-radius:12px;border:1px solid rgba(72,219,251,.18);background:rgba(0,0,0,.16)}
.dashboard-customizer[hidden]{display:none}
.customizer-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.8rem}
.customizer-header strong,.customizer-header span{display:block}
.customizer-header span{color:#888;font-size:.75rem;margin-top:.15rem}
.customizer-close,.customizer-reset{padding:.4rem .65rem;border-radius:7px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.05);color:#bbb;cursor:pointer}
.customizer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}
.customizer-option{display:flex;align-items:center;gap:.55rem;padding:.55rem .65rem;border-radius:8px;background:rgba(255,255,255,.04);color:#ccc;font-size:.82rem;cursor:pointer}
.customizer-option input{width:16px;height:16px;accent-color:#48dbfb}
.customizer-reset{margin-top:.7rem;font-size:.75rem}
@media(max-width:500px){.customizer-grid{grid-template-columns:1fr}.customizer-header{align-items:flex-start}}

.customizer-groups{display:grid;gap:.85rem}
.customizer-group{padding:.7rem;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.025)}
.customizer-group-title{color:#777;font-size:.68rem;font-weight:700;letter-spacing:.08em;margin-bottom:.45rem}
.customizer-list{display:grid;gap:.4rem}
.customizer-option{display:flex;align-items:center;gap:.5rem;padding:.55rem .65rem;border-radius:8px;background:rgba(255,255,255,.04);color:#ccc;font-size:.82rem;cursor:grab;border:1px solid transparent;transition:background .12s,border-color .12s,opacity .12s}
.customizer-option:hover{background:rgba(255,255,255,.07)}
.customizer-option.dragging{opacity:.45;border-color:rgba(72,219,251,.35)}
.customizer-option label{display:flex;align-items:center;gap:.55rem;flex:1;cursor:pointer}
.customizer-option input{width:16px;height:16px;accent-color:#48dbfb}
.drag-handle{color:#666;font-size:1rem;letter-spacing:-.18em;user-select:none}
@media(max-width:500px){.customizer-option{padding:.65rem}.customizer-group{padding:.6rem}}

.telemetry-status.live{color:#9ee7b1;border-color:rgba(158,231,177,.3);background:rgba(158,231,177,.08)}
.telemetry-status.stale{color:#feca57;border-color:rgba(254,202,87,.3);background:rgba(254,202,87,.1)}
.dashboard-widget[hidden]{display:none}
.dashboard-widget[data-service-status="down"]{border-color:rgba(255,107,107,.28)}
.dashboard-widget[data-service-status="up"]{border-color:rgba(158,231,177,.22)}