*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#fff;--bg2:#f5f5f3;--bg3:#e8e8e4;
  --text:#1a1a18;--text2:#666;--text3:#aaa;
  --border:rgba(0,0,0,.1);--border2:rgba(0,0,0,.2);
  --radius:10px;--radius-lg:14px;
  --blue:#185FA5;--red:#c0392b;--amber:#BA7517;--green:#1D9E75;
  --sidebar:220px;
}
@media(prefers-color-scheme:dark){
  :root{--bg:#1c1c1a;--bg2:#252523;--bg3:#313130;--text:#f0f0ea;--text2:#999;--text3:#555;--border:rgba(255,255,255,.08);--border2:rgba(255,255,255,.18)}
}
html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:15px;color:var(--text);background:var(--bg3)}

/* ── SHELL ── */
.shell{display:flex;height:100vh;max-width:1400px;margin:0 auto;background:var(--bg)}

/* ── SIDEBAR ── */
.sidebar{width:var(--sidebar);flex-shrink:0;border-right:0.5px solid var(--border);display:flex;flex-direction:column;background:var(--bg2);position:sticky;top:0;height:100vh;overflow-y:auto}
.sidebar-logo{padding:1.1rem 1.25rem .75rem;font-size:16px;font-weight:700;border-bottom:0.5px solid var(--border);white-space:nowrap}
.sidebar-logo span{font-weight:400;color:var(--text2);font-size:13px;display:block;margin-top:1px}
.sidebar-nav{padding:.5rem .5rem;flex:1}
.snav-btn{display:flex;align-items:center;gap:9px;width:100%;padding:8px 12px;border-radius:var(--radius);border:none;background:transparent;color:var(--text2);cursor:pointer;font-size:13px;text-align:left;transition:all .15s;font-weight:500}
.snav-btn:hover{background:var(--bg3);color:var(--text)}
.snav-btn.active{background:var(--bg);color:var(--text);font-weight:600}
.snav-icon{font-size:15px;width:20px;text-align:center;flex-shrink:0}
.sidebar-trip{padding:.75rem 1rem;border-top:0.5px solid var(--border);font-size:12px;color:var(--text2)}
.sidebar-trip strong{display:block;color:var(--text);font-size:13px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ── MAIN ── */
.main{flex:1;display:flex;flex-direction:column;min-width:0;overflow-y:auto}
.topbar{padding:.85rem 1.5rem;border-bottom:0.5px solid var(--border);display:flex;align-items:center;justify-content:space-between;background:var(--bg);position:sticky;top:0;z-index:20;gap:1rem}
.topbar h2{font-size:17px;font-weight:600;white-space:nowrap}
.topbar-actions{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.content{padding:1.5rem;flex:1}

/* ── MOBILE ── */
.mobile-header{display:none;padding:.8rem 1rem;border-bottom:0.5px solid var(--border);background:var(--bg);position:sticky;top:0;z-index:20;align-items:center;justify-content:space-between}
.mobile-header h1{font-size:16px;font-weight:700}
.mobile-nav{display:none;gap:0;border-bottom:0.5px solid var(--border);background:var(--bg);overflow-x:auto;-webkit-overflow-scrolling:touch;padding:.4rem .6rem;position:sticky;top:49px;z-index:19}
.mobile-nav::-webkit-scrollbar{display:none}
.mnav-btn{padding:6px 11px;border-radius:var(--radius);border:none;background:transparent;color:var(--text2);cursor:pointer;font-size:12px;white-space:nowrap;font-weight:500;transition:all .15s}
.mnav-btn.active{background:var(--bg2);color:var(--text);font-weight:600}
@media(max-width:700px){
  .sidebar{display:none}
  .mobile-header{display:flex}
  .mobile-nav{display:flex}
  .topbar{display:none}
  .content{padding:1rem}
  .shell{height:auto;min-height:100vh}
  .main{overflow-y:visible}
}

/* ── COMMON ── */
.card{background:var(--bg);border:0.5px solid var(--border);border-radius:var(--radius-lg);padding:1rem 1.25rem;margin-bottom:.75rem}
.section-title{font-size:11px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.6rem}
input[type=text],input[type=url],select,textarea{width:100%;padding:9px 12px;border:0.5px solid var(--border2);border-radius:var(--radius);font-size:14px;background:var(--bg);color:var(--text);outline:none;transition:border .15s;font-family:inherit}
input:focus,select:focus,textarea:focus{border-color:#888}
textarea{resize:vertical;min-height:90px;line-height:1.6}
.btn{padding:7px 16px;border-radius:var(--radius);border:0.5px solid var(--border2);background:var(--bg);cursor:pointer;font-size:13px;color:var(--text);transition:all .15s;font-weight:500}
.btn:hover{background:var(--bg2)}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--text);color:var(--bg);border-color:var(--text)}
.btn-primary:hover{opacity:.85;background:var(--text)}
.btn-sm{padding:4px 10px;font-size:12px}
.btn-danger{color:var(--red);border-color:rgba(192,57,43,.4)}
.row{display:flex;gap:8px;align-items:center}
.chip{display:inline-flex;align-items:center;padding:2px 8px;border-radius:20px;font-size:11px;font-weight:500}
.chips-row{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}
.progress-bar{height:5px;background:var(--bg2);border-radius:3px;overflow:hidden;margin:.4rem 0}
.progress-fill{height:100%;background:var(--text);border-radius:3px;transition:width .4s}
.empty{text-align:center;color:var(--text3);padding:3rem 1rem;font-size:14px}
.badge{font-size:11px;padding:3px 8px;border-radius:10px;background:var(--bg2);color:var(--text2);font-weight:500}
.badge-arc{background:#FAC77530;color:var(--amber)}
.tag-btn{padding:5px 12px;border-radius:20px;border:0.5px solid var(--border2);background:transparent;cursor:pointer;font-size:13px;color:var(--text2);transition:all .15s}
.tag-btn.sel{background:var(--text);color:var(--bg);border-color:var(--text)}

.stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:1rem}
.stat{background:var(--bg2);border-radius:var(--radius);padding:.75rem;text-align:center}
.stat-num{font-size:24px;font-weight:600}
.stat-lbl{font-size:12px;color:var(--text2);margin-top:2px}
.tag-select{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.divider{height:0.5px;background:var(--border);margin:.75rem 0}
.subtab-row{display:flex;gap:0;margin-bottom:1rem;border:0.5px solid var(--border2);border-radius:var(--radius);overflow:hidden}
.subtab{flex:1;padding:8px;border:none;background:transparent;cursor:pointer;font-size:13px;color:var(--text2);font-weight:500;transition:all .15s}
.subtab.active{background:var(--text);color:var(--bg)}
.tabs-strip{display:flex;gap:4px;margin-bottom:1rem;overflow-x:auto}
.tabs-strip::-webkit-scrollbar{display:none}
.tab-pill{padding:5px 14px;border-radius:20px;border:0.5px solid var(--border2);background:transparent;cursor:pointer;font-size:13px;color:var(--text2);white-space:nowrap;font-weight:500;transition:all .15s}
.tab-pill.active{background:var(--text);color:var(--bg);border-color:var(--text)}

/* ── MODALS ── */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:200;padding:1rem}
.modal{background:var(--bg);border-radius:var(--radius-lg);border:0.5px solid var(--border);padding:1.5rem;width:100%;max-width:520px;max-height:88vh;overflow-y:auto}
.modal h2{font-size:16px;font-weight:600;margin-bottom:1rem}
.form-row{margin-bottom:.85rem}
.form-row label{font-size:11px;font-weight:600;color:var(--text2);display:block;margin-bottom:5px;text-transform:uppercase;letter-spacing:.05em}

/* ── CLICKABLE ROWS ── */
.clickrow{display:flex;align-items:flex-start;gap:10px;padding:.65rem 0;border-bottom:0.5px solid var(--border);cursor:pointer;transition:background .1s;border-radius:4px;margin:0 -4px;padding-left:4px;padding-right:4px}
.clickrow:last-child{border-bottom:none}
.clickrow:hover{background:var(--bg2)}
.clickrow-body{flex:1;min-width:0}
.clickrow-arrow{color:var(--text3);font-size:12px;margin-top:3px;flex-shrink:0}
.item-label{font-size:14px;line-height:1.4}
.item-label.done{text-decoration:line-through;color:var(--text3)}
.checkbox{width:20px;height:20px;border:1.5px solid var(--border2);border-radius:5px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;margin-top:2px}
.checkbox.checked{background:var(--text);border-color:var(--text)}
.checkmark{color:var(--bg);font-size:12px;line-height:1}
.sel-cb{width:18px;height:18px;border:1.5px solid var(--border2);border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:3px;transition:all .15s}
.sel-cb.on{background:var(--blue);border-color:var(--blue)}
.sel-cbm{color:#fff;font-size:10px;line-height:1}

/* ── DRAG & DROP ── */
.cat-group{margin-bottom:1rem}
.cat-group.drag-over .cat-card{border-color:var(--blue);background:rgba(24,95,165,.05)}
.item-row-drag{cursor:pointer;display:flex;align-items:flex-start;gap:10px;padding:.6rem 4px;border-bottom:0.5px solid var(--border);border-radius:4px;transition:background .1s}
.item-row-drag:last-child{border-bottom:none}
.item-row-drag:hover{background:var(--bg2)}
.item-row-drag.dragging{opacity:.4}
.item-row-drag.row-selected{background:rgba(24,95,165,.07)}
.item-row-drag.row-selected:hover{background:rgba(24,95,165,.12)}
.drag-handle{color:var(--text3);font-size:13px;cursor:grab;padding:2px 4px 0 0;flex-shrink:0;user-select:none}
.cat-card{background:var(--bg);border:0.5px solid var(--border);border-radius:var(--radius-lg);padding:.25rem 1rem;transition:border-color .15s,background .15s}

/* ── TRIP CARDS ── */
.trip-card{cursor:pointer;transition:border-color .15s,box-shadow .15s}
.trip-card:hover{border-color:var(--border2);box-shadow:0 2px 8px rgba(0,0,0,.06)}
.trip-card.arc{opacity:.6}
.trip-card-header{display:flex;align-items:flex-start;gap:6px}
.trip-card-header .kebab-wrap{margin-top:-2px}

/* ── PEOPLE GRID ── */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.person-card{cursor:pointer;transition:border-color .15s}
.person-card:hover{border-color:var(--border2)}
.avatar{border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;flex-shrink:0}

/* ── BULK BAR ── */
.bulk-bar{position:sticky;bottom:0;background:var(--bg);border-top:0.5px solid var(--border);padding:.75rem 1.5rem;display:flex;align-items:center;gap:8px;flex-wrap:wrap;z-index:15}

/* ── KEBAB MENU ── */
.kebab-wrap{position:relative;flex-shrink:0}
.kebab-btn{width:32px;height:32px;border-radius:var(--radius);border:0.5px solid var(--border2);background:transparent;cursor:pointer;font-size:18px;line-height:1;color:var(--text2);display:flex;align-items:center;justify-content:center;transition:background .15s}
.kebab-btn:hover{background:var(--bg2);color:var(--text)}
.kebab-menu{position:absolute;top:calc(100% + 4px);right:0;background:var(--bg);border:0.5px solid var(--border2);border-radius:var(--radius);box-shadow:0 4px 16px rgba(0,0,0,.12);min-width:160px;z-index:300;overflow:hidden;display:none}
.kebab-menu.open{display:block}
.kebab-item{display:block;width:100%;padding:9px 14px;border:none;background:transparent;cursor:pointer;font-size:13px;text-align:left;color:var(--text);transition:background .1s}
.kebab-item:hover{background:var(--bg2)}
.kebab-item.danger{color:var(--red)}
.kebab-divider{height:0.5px;background:var(--border);margin:3px 0}

/* ── LINKS / DOCS ── */
.link-row{display:flex;align-items:center;gap:8px;padding:.5rem 4px;border-bottom:0.5px solid var(--border);cursor:pointer;border-radius:4px;margin:0 -4px;transition:background .1s}
.link-row:last-child{border-bottom:none}
.link-row:hover{background:var(--bg2)}
.link-row a{font-size:14px;color:var(--blue);text-decoration:none;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;pointer-events:none}
.doc-row{display:flex;align-items:center;gap:10px;padding:.5rem 4px;border-bottom:0.5px solid var(--border);cursor:pointer;border-radius:4px;margin:0 -4px;transition:background .1s}
.doc-row:last-child{border-bottom:none}
.doc-row:hover{background:var(--bg2)}
.doc-thumb{width:40px;height:40px;border-radius:6px;background:var(--bg2);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;overflow:hidden}
.doc-thumb img{width:100%;height:100%;object-fit:cover}

/* ── ITEM LIBRARY ── */
.lib-filter-bar{background:var(--bg2);border:0.5px solid var(--border);border-radius:var(--radius-lg);padding:.75rem 1rem;margin-bottom:1rem}
.lib-filter-group{margin-top:.6rem}
.lib-filter-bar .lib-filter-group:first-child{margin-top:0}
.lib-filter-label{font-size:11px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:.06em;display:block;margin-bottom:4px}
.cat-title:hover{color:var(--text2)}
.cat-chevron{font-size:9px;color:var(--text3)}

/* ── AUTH OVERLAY ── */
#auth-overlay{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1rem;padding:2rem}
#auth-overlay.hidden{display:none}
.auth-card{background:var(--bg2);border:0.5px solid var(--border);border-radius:var(--radius-lg);padding:2rem;width:100%;max-width:400px}
.auth-card h2{font-size:18px;font-weight:600;margin-bottom:.5rem}
.auth-card h3{font-size:13px;font-weight:600}
.auth-card p{font-size:13px;color:var(--text2);margin-bottom:1.25rem}
.btn-google{display:flex;align-items:center;gap:10px;padding:10px 20px;border-radius:var(--radius);border:0.5px solid var(--border2);background:var(--bg);cursor:pointer;font-size:14px;font-weight:500;color:var(--text);width:100%;justify-content:center;transition:background .15s}
.btn-google:hover{background:var(--bg2)}
.btn-text{background:transparent;border:none;color:var(--blue)}

/* ── SIDEBAR AUTH SECTION ── */
#sidebar-auth{font-size:12px}

/* ── LAYOUT HELPERS ── */
@media(min-width:900px){
  .two-col{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
}