*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #FAFAF8;--text: #1A1A1A;--accent: #2E7D6B;--accent-hover: #256357;--border: #E0DDD8;--radius: 8px}body{font-family:system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);line-height:1.6}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal{background:#fff;border-radius:var(--radius);padding:2rem;max-width:400px;width:90%;display:flex;flex-direction:column;gap:1rem}.modal h2{font-size:1.4rem}.modal p{color:#555;font-size:.95rem}.modal input[type=email]{width:100%;padding:.6rem .8rem;border:1px solid var(--border);border-radius:var(--radius);font-size:1rem}.modal button[type=submit]{background:var(--accent);color:#fff;border:none;border-radius:var(--radius);padding:.65rem 1.2rem;font-size:1rem;cursor:pointer;width:100%}.modal button[type=submit]:hover{background:var(--accent-hover)}.error{color:#c0392b;font-size:.85rem}.or-divider{text-align:center;color:#999}.btn-google{display:block;text-align:center;background:#fff;color:var(--text);border:1px solid var(--border);border-radius:var(--radius);padding:.65rem 1.2rem;text-decoration:none;font-size:.95rem}.btn-google:hover{background:#f5f5f5}.navbar{display:flex;align-items:center;justify-content:space-between;padding:.8rem 2rem;border-bottom:1px solid var(--border);background:#fff;position:sticky;top:0;z-index:100}.navbar-brand{font-weight:700;font-size:1.1rem;text-decoration:none;color:var(--accent)}.navbar-right{display:flex;align-items:center;gap:1rem}.navbar-user{font-size:.9rem;color:#666}.main{max-width:1100px;margin:0 auto;padding:2rem 1rem}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem}.page-header h1{font-size:1.8rem}.btn-primary{background:var(--accent);color:#fff;border:none;border-radius:var(--radius);padding:.6rem 1.2rem;font-size:.95rem;cursor:pointer;text-decoration:none;display:inline-block}.btn-primary:hover{background:var(--accent-hover)}.btn-secondary{background:transparent;color:var(--accent);border:1px solid var(--accent);border-radius:var(--radius);padding:.4rem .9rem;font-size:.9rem;cursor:pointer}.btn-ghost{background:none;border:none;color:#666;cursor:pointer;font-size:.9rem}.btn-ghost:hover{color:var(--text)}.trips-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.trip-card{text-decoration:none;color:var(--text);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:box-shadow .2s}.trip-card:hover{box-shadow:0 4px 16px #0000001a}.trip-card-image{aspect-ratio:16/9;overflow:hidden;background:#eee}.trip-card-image img{width:100%;height:100%;object-fit:cover}.trip-card-placeholder{width:100%;height:100%;background:linear-gradient(135deg,#e8e4df,#d0ccc7)}.trip-card-body{padding:1rem}.trip-card-body h2{font-size:1.1rem;margin-bottom:.3rem}.trip-card-body p{font-size:.9rem;color:#666;margin-bottom:.5rem}.trip-travelers{font-size:.8rem;color:var(--accent)}.form{display:flex;flex-direction:column;gap:1.2rem;max-width:600px}.form label{display:flex;flex-direction:column;gap:.3rem;font-size:.95rem;font-weight:500}.form input,.form textarea,.form select{padding:.6rem .8rem;border:1px solid var(--border);border-radius:var(--radius);font-size:1rem;font-family:inherit}.form fieldset{border:1px solid var(--border);border-radius:var(--radius);padding:1rem}.form legend{padding:0 .4rem;font-weight:500}.traveler-row{display:flex;gap:.5rem;margin-bottom:.5rem}.traveler-row input{flex:1}.traveler-row button{background:none;border:1px solid #ccc;border-radius:4px;cursor:pointer}.cover-preview{width:100%;max-width:300px;border-radius:var(--radius);margin-top:.5rem}.trip-hero{width:100%;max-height:400px;object-fit:cover;border-radius:var(--radius);margin-bottom:1.5rem}.loading{padding:2rem;text-align:center;color:#666}.empty-state{color:#888;font-size:1rem;padding:2rem 0}.error-msg{color:#c0392b;background:#fdf0ed;border-radius:var(--radius);padding:.8rem 1rem;font-size:.9rem}.trip-detail-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin:1.5rem 0 2rem}.trip-description{color:#555;margin-top:.4rem}.trip-travelers-detail{font-size:.9rem;color:var(--accent);margin-top:.3rem}.experiences-list{display:flex;flex-direction:column;gap:3rem}.experience-block{border-top:2px solid var(--border);padding-top:2rem}.experience-title{font-size:1.4rem;font-weight:700;margin-bottom:.3rem}.experience-date{font-size:.85rem;color:#888;display:block;margin-bottom:1rem}.experience-story p{margin-bottom:.8rem;line-height:1.7}.experience-photos{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}.experience-photo{width:200px;height:150px;object-fit:cover;border-radius:var(--radius);cursor:pointer}.experience-links{display:flex;flex-direction:column;gap:.3rem;margin-top:.8rem}.experience-link{color:var(--accent);font-size:.9rem;text-decoration:none;display:inline-flex;align-items:center;gap:.3rem}.experience-link:hover{text-decoration:underline}.experience-link:before{content:"🔗";font-size:.8rem}.experience-gpx-note{background:#f0f7f5;border-radius:var(--radius);padding:.6rem 1rem;font-size:.9rem;color:var(--accent);margin-top:.8rem}.experience-actions{display:flex;gap:.5rem;margin-top:1rem;flex-wrap:wrap}.btn-secondary-sm{background:none;border:1px solid var(--accent);color:var(--accent);border-radius:var(--radius);padding:.3rem .8rem;font-size:.85rem;cursor:pointer;text-decoration:none;display:inline-block}.btn-secondary-sm:hover{background:#f0f9f6}.btn-danger-sm{background:none;border:1px solid #e74c3c;color:#e74c3c;border-radius:var(--radius);padding:.3rem .8rem;font-size:.85rem;cursor:pointer}.btn-danger-sm:hover{background:#fdf0ed}.photo-previews{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.photo-thumb{width:100px;height:80px;object-fit:cover;border-radius:var(--radius)}.file-selected{font-size:.85rem;color:var(--accent);margin-top:.3rem;display:block}.link-row{display:flex;gap:.5rem;margin-bottom:.5rem}.link-row input{flex:1}.link-row button{background:none;border:1px solid #ccc;border-radius:4px;cursor:pointer}.section-placeholder{background:#f5f5f0;border-radius:var(--radius);padding:1rem;color:#888;font-size:.9rem;border:1px dashed var(--border)}.map-picker{height:350px;border-radius:var(--radius);border:1px solid var(--border);margin-top:.5rem}.map-viewer{height:300px;border-radius:var(--radius);border:1px solid var(--border);margin:1rem 0}.groups-list{display:flex;flex-direction:column;gap:1.5rem;margin-top:1.5rem}.group-card{border:1px solid var(--border);border-radius:var(--radius);padding:1.2rem}.group-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.8rem}.group-card-header h2{font-size:1.1rem}.member-list{list-style:none;margin-bottom:.8rem}.member-item{display:flex;justify-content:space-between;align-items:center;padding:.3rem 0;border-bottom:1px solid var(--border)}.member-empty{color:#888;font-size:.9rem;font-style:italic}.member-add-form{margin-top:.5rem}.inline-form{display:flex;gap:.5rem;margin-bottom:1.5rem}.inline-form input{flex:1;padding:.6rem .8rem;border:1px solid var(--border);border-radius:var(--radius);font-size:.95rem}.share-list{list-style:none;margin:.5rem 0 1rem}.share-item{display:flex;align-items:center;gap:.5rem;padding:.4rem 0;border-bottom:1px solid var(--border)}.share-item span:first-child{flex:1}.badge{font-size:.75rem;padding:.2rem .5rem;border-radius:999px;font-weight:600}.badge-reader{background:#e8f4f8;color:#2980b9}.badge-creator{background:#e8f5e9;color:#27ae60}.navbar-link{color:var(--text);text-decoration:none;font-size:.9rem}.navbar-link:hover{color:var(--accent)}.trip-detail-actions{display:flex;gap:.5rem}.comment-section{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border)}.comment-title{font-size:1rem;font-weight:600;margin-bottom:1rem;color:#555}.comment-list{list-style:none;display:flex;flex-direction:column;gap:.8rem;margin-bottom:1.2rem}.comment-item{background:#f8f8f6;border-radius:var(--radius);padding:.8rem 1rem}.comment-author{font-weight:600;font-size:.85rem;color:var(--accent)}.comment-date{font-size:.75rem;color:#aaa;margin-left:.5rem}.comment-content{margin-top:.3rem;font-size:.95rem;line-height:1.5}.comment-form{display:flex;flex-direction:column;gap:.5rem}.comment-form textarea{padding:.6rem .8rem;border:1px solid var(--border);border-radius:var(--radius);font-size:.95rem;font-family:inherit;resize:vertical}.comment-login-hint{font-size:.9rem;color:#888;font-style:italic}.notif-bell{position:relative;text-decoration:none;display:flex;align-items:center}.notif-icon{font-size:1.2rem}.notif-badge{position:absolute;top:-6px;right:-8px;background:#e74c3c;color:#fff;font-size:.65rem;font-weight:700;border-radius:999px;min-width:16px;height:16px;display:flex;align-items:center;justify-content:center;padding:0 3px}.notif-list{list-style:none;display:flex;flex-direction:column;gap:0}.notif-item{display:flex;justify-content:space-between;align-items:flex-start;padding:1rem;border-bottom:1px solid var(--border);cursor:pointer;gap:1rem}.notif-item:hover{background:#f8f8f6}.notif-unread{background:#f0f7f5}.notif-unread .notif-text{font-weight:600}.notif-text{flex:1}.notif-link{color:var(--text);text-decoration:none;font-size:.95rem;display:block}.notif-link:hover{color:var(--accent)}.notif-comment{font-size:.85rem;color:#888;margin-top:.2rem;font-style:italic}.notif-time{font-size:.8rem;color:#aaa;white-space:nowrap}
