body{color:#1d1d1f;margin:0;-webkit-font-smoothing:antialiased}.cafe-page,body{background-color:#f5f5f7}.cafe-page{min-height:100vh}.cafe-main{padding:3rem 1.5rem 5rem;max-width:1200px;margin:0 auto}.cafe-header{margin-bottom:3rem;padding-top:1rem}@media (max-width:768px){.cafe-header{padding-top:2rem}}.cafe-header-title{font-size:2.25rem;font-weight:700;letter-spacing:-.02em;color:#1d1d1f;line-height:1.2;margin-bottom:.5rem}.cafe-header-subtitle{color:#9ca3af}@media (min-width:768px){.cafe-header-title{font-size:3rem}}.cafe-guide-section{margin-bottom:4rem}.cafe-section-subtitle{font-size:.875rem;color:#86868b;margin-top:.25rem}.cafe-guide-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:12px;gap:12px}@media (min-width:768px){.cafe-guide-grid{grid-template-columns:repeat(4,1fr);gap:16px}}.cafe-guide-card{background:#ffffff;border:1px solid #e5e5e5;border-radius:8px;padding:20px 16px;text-decoration:none;color:inherit;transition:all .2s ease;min-height:110px;display:flex;flex-direction:column;justify-content:space-between}.cafe-guide-card:hover{border-color:#d1d1d1;box-shadow:0 4px 12px rgba(0,0,0,.08)}.cafe-guide-number{font-size:11px;font-weight:600;color:#0071e3;letter-spacing:.05em;margin-bottom:8px}.cafe-guide-name{font-size:15px;font-weight:600;color:#1d1d1f;margin-bottom:4px;line-height:1.3}.cafe-guide-desc{font-size:12px;color:#86868b;line-height:1.4}@media (max-width:768px){.cafe-guide-card{padding:16px 14px;min-height:100px}.cafe-guide-number{font-size:10px}.cafe-guide-name{font-size:14px}.cafe-guide-desc{font-size:11px}}.cafe-trending-section{margin-bottom:4rem}.cafe-section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem;padding-left:.25rem;padding-right:.25rem}.cafe-section-title{font-size:1.5rem;font-weight:700;color:#1d1d1f}.cafe-see-all{color:#0071e3;font-size:.875rem;font-weight:500;text-decoration:none}.cafe-see-all:hover{text-decoration:underline}.cafe-trending-container{display:flex;gap:1.5rem;overflow-x:auto;padding-bottom:2rem;scroll-snap-type:x mandatory;-ms-overflow-style:none;scrollbar-width:none}.cafe-trending-container::-webkit-scrollbar{display:none}.cafe-trending-card{scroll-snap-align:center;flex-shrink:0;width:85vw;position:relative;cursor:pointer;overflow:hidden;border-radius:1rem;box-shadow:0 10px 30px rgba(0,0,0,.15);height:400px}@media (min-width:768px){.cafe-trending-card{width:400px}}.cafe-trending-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s ease}.cafe-trending-card:hover .cafe-trending-image{transform:scale(1.05)}.cafe-trending-overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.9) 0,rgba(0,0,0,.2) 50%,transparent)}.cafe-trending-content{position:absolute;bottom:0;left:0;padding:1.5rem;color:white;width:100%}.cafe-trending-badge{font-size:.75rem;font-weight:700;color:#fb923c;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem}.cafe-trending-name{font-size:1.875rem;font-weight:700;line-height:1.2;margin-bottom:.25rem}.cafe-trending-subname{font-size:1.125rem;opacity:.8;margin-bottom:.75rem;font-family:serif}.cafe-trending-description{font-size:.875rem;color:#d1d5db;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.cafe-filter-section{margin-bottom:1.5rem}.cafe-filter-label{font-size:.875rem;font-weight:600;color:#1d1d1f;margin-bottom:.75rem;padding-left:.25rem}.cafe-filter-tabs{display:flex;gap:.75rem;overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none;padding-bottom:.5rem}.cafe-filter-tabs::-webkit-scrollbar{display:none}@media (min-width:768px){.cafe-filter-tabs{flex-wrap:wrap}}.cafe-tab{padding:.5rem 1.25rem;border-radius:9999px;background-color:white;color:#6b7280;box-shadow:0 1px 3px rgba(0,0,0,.1);border:1px solid rgba(229,231,235,.5);font-size:.875rem;white-space:nowrap;cursor:pointer;transition:all .3s ease;font-weight:500}.cafe-tab:hover{background-color:#f9fafb}.cafe-tab.active{background-color:#1d1d1f;color:white;font-weight:600}.cafe-grid{display:grid;grid-template-columns:1fr;grid-gap:2.5rem 1.5rem;gap:2.5rem 1.5rem}@media (min-width:768px){.cafe-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:1024px){.cafe-grid{grid-template-columns:repeat(3,1fr)}}.cafe-card{cursor:pointer;border-radius:1rem;transition:all .4s cubic-bezier(.4,0,.2,1);animation:fadeIn .5s ease-out forwards;opacity:0}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.cafe-card:hover{transform:translateY(-8px)}.cafe-card:hover .cafe-card-image{transform:scale(1.08)}.cafe-card:hover .cafe-card-name{color:#0071e3}.cafe-card-image-wrapper{position:relative;aspect-ratio:4/3;border-radius:1rem;overflow:hidden;background-color:#e5e7eb;margin-bottom:1rem}.cafe-card-image{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.4,0,.2,1)}.cafe-card-region-badge{position:absolute;top:.75rem;right:.75rem;background-color:rgba(0,0,0,.6);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:white;font-size:.75rem;font-weight:700;padding:.25rem .625rem;border-radius:9999px}.cafe-card-content{padding:0}.cafe-card-name{font-size:1.125rem;font-weight:700;color:#111827;line-height:1.3;transition:color .3s ease}.cafe-card-subname{font-size:.875rem;color:#6b7280;font-weight:500;margin-top:.125rem}.cafe-card-description{font-size:.875rem;color:#6b7280;margin-top:.5rem;line-height:1.5;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.cafe-card-tags{margin-top:.75rem;display:flex;flex-wrap:wrap;gap:.5rem}.cafe-card-tag{font-size:.6875rem;color:#9ca3af;border:1px solid #e5e7eb;padding:.125rem .5rem;border-radius:9999px}.cafe-load-more{display:flex;justify-content:center;margin-top:3rem;padding-bottom:2rem}.cafe-load-more-btn{padding:.875rem 2.5rem;background-color:#1d1d1f;color:white;border:none;border-radius:9999px;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px rgba(0,0,0,.15)}.cafe-load-more-btn:hover:not(:disabled){background-color:#2d2d2f;transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.2)}.cafe-load-more-btn:disabled{background-color:#d1d5db;color:#9ca3af;cursor:not-allowed;transform:none;box-shadow:none}.cafe-loading-state{text-align:center;padding:5rem 0}.cafe-loading-state p{color:#6b7280;font-size:1.125rem;font-weight:500}.cafe-empty-state{text-align:center;padding:5rem 0}.cafe-empty-state p{color:#9ca3af;font-size:1.125rem}.cafe-footer{background-color:white;border-top:1px solid #e5e7eb;padding-top:2.5rem;padding-bottom:2.5rem}.cafe-footer p{max-width:1200px;margin:0 auto;padding:0 1.5rem;text-align:center;font-size:.75rem;color:#9ca3af}@media (min-width:768px){.cafe-footer p{text-align:left}}