*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--cream: #F7F4EF;--ink: #1A1714;--ink-light: #6B6560;--ink-xlight: #B0AAA4;--accent: #C8412A;--border: #E2DDD8;--white: #FFFFFF;--panel-city: 295px;--panel-detail: 375px;--font-display: "DM Serif Display", Georgia, serif;--font-body: "IBM Plex Sans", system-ui, sans-serif;--radius: 8px;--transition: .18s ease;--drawer-transition: .5s cubic-bezier(.22, 1, .36, 1)}html,body,#root{height:100%;overflow:hidden}body{font-family:var(--font-body);background:var(--cream);color:var(--ink);-webkit-font-smoothing:antialiased}.app{display:flex;height:100dvh;overflow:hidden}.panel-cities{width:var(--panel-city);flex-shrink:0;background:var(--white);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;z-index:30}.panel-cities__header{padding:16px 10px 16px 20px;border-bottom:1px solid var(--border);flex-shrink:0;background:#ffe8eb}.logo{display:flex;align-items:center;gap:14px}.logo__img{width:80px;height:80px;border-radius:50%;flex-shrink:0;object-fit:cover}.logo__text-block{flex:1;min-width:0}.logo__title{font-family:var(--font-body);font-size:12px;font-weight:600;color:var(--ink);line-height:1.35}.logo__sub{font-family:var(--font-body);font-size:11px;font-weight:400;color:var(--ink-light);margin-top:2px;line-height:1.3}.panel-cities__scroll{flex:1;overflow-y:auto;overscroll-behavior:contain}.panel-cities__scroll::-webkit-scrollbar{width:4px}.panel-cities__scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.city-item{display:flex;align-items:center;gap:16px;padding:14px 20px;cursor:pointer;border-bottom:1px solid var(--border);transition:background var(--transition);background:var(--white)}.city-item:hover{background:var(--cream)}.city-item--active{background:var(--white);border-left:3px solid var(--accent);padding-left:17px}.app--city-selected .city-item:not(.city-item--active) .city-item__name{color:var(--ink-xlight)}.app--city-selected .city-item:not(.city-item--active) .city-item__country{color:var(--ink-xlight)}.app--city-selected .city-item:not(.city-item--active) .city-item__count{opacity:.4}.app--city-selected .city-item:not(.city-item--active) .city-item__thumb{opacity:.4}.city-item__thumb{width:64px;height:64px;border-radius:50%;object-fit:cover;flex-shrink:0;background:var(--border);box-shadow:0 2px 8px #0000002e}.city-item__thumb--placeholder{background:var(--border);display:flex;align-items:center;justify-content:center;color:var(--ink-xlight);font-size:24px}.city-item__info{flex:1;min-width:0}.city-item__name{font-family:var(--font-display);font-size:25px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.15}.city-item__country{font-size:12px;font-weight:600;color:#e1232f;margin-top:2px;text-transform:uppercase;letter-spacing:.06em}.city-item__count{font-size:11px;font-weight:500;color:var(--accent);letter-spacing:.06em;text-transform:uppercase;margin-top:3px}.panel-detail{width:var(--panel-detail);flex-shrink:0;background:var(--white);border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;transform:translate(calc(-1 * var(--panel-detail)));transition:transform var(--drawer-transition),margin-right var(--drawer-transition);margin-right:calc(-1 * var(--panel-detail));will-change:transform;z-index:25;position:relative}.panel-detail:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;box-shadow:inset 6px 0 12px -4px #00000024;pointer-events:none;z-index:999}.panel-detail--open{transform:translate(0);margin-right:0}.city-hero{position:relative;height:280px;flex-shrink:0;overflow:hidden}.city-hero__img{width:100%;height:100%;object-fit:cover}.city-hero__overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#1a171473}.city-hero__text{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;text-align:center}.city-hero__name{font-family:var(--font-display);font-size:56px;color:#fff;line-height:1}.city-hero__country{font-size:13px;font-weight:700;color:#ffffffb3;letter-spacing:.1em;text-transform:uppercase;margin-top:6px}.stories-header{padding:16px 20px 14px;border-bottom:1px solid var(--border);flex-shrink:0}.stories-header__title{font-family:var(--font-display);font-size:28px;color:var(--ink);line-height:1.1}.stories-scroll{flex:1;overflow-y:auto;overscroll-behavior:contain;background:#eff6ff}.stories-scroll::-webkit-scrollbar{width:4px}.stories-scroll::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.story-group-heading{padding:10px 16px 8px;font-size:10px;font-weight:600;color:var(--ink-light);letter-spacing:.09em;text-transform:uppercase;background:#eff6ff;border-bottom:1px solid var(--border);position:sticky;top:0;z-index:1}.story-item{display:flex;align-items:flex-start;gap:14px;padding:16px;border-bottom:1px solid var(--border);cursor:pointer;transition:background var(--transition)}.story-item:hover{background:#dce8f9}.story-item__icon-podcast{width:56px;height:56px;border-radius:14px;object-fit:cover;flex-shrink:0;background:var(--border);border:2px solid white;box-shadow:0 2px 8px #0003}.story-item__icon-video{width:56px;height:56px;border-radius:50%;object-fit:cover;flex-shrink:0;background:var(--border);border:2px solid white;box-shadow:0 2px 8px #0003}.story-item__icon--placeholder{background:var(--border);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;color:var(--ink-light);flex-shrink:0;width:56px;height:56px}.story-item__body{flex:1;min-width:0}.story-item__title{font-size:16px;font-weight:500;color:var(--ink);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.story-item__meta{display:flex;align-items:center;gap:6px;margin-top:5px;flex-wrap:wrap}.story-item__type{font-size:12px;font-weight:600;color:var(--accent)}.story-item__source{font-size:12px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-slide-track{display:flex;flex-direction:row;width:200%;flex:1;min-height:0;transform:translate(0);transition:transform .38s cubic-bezier(.22,1,.36,1)}.nav-slide-track--stories{transform:translate(-50%)}.nav-slide-panel{width:50%;display:flex;flex-direction:column;min-height:0;overflow:hidden}.city-overview{flex:1;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;background:#153b8f}.city-overview::-webkit-scrollbar{width:4px}.city-overview::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.overview-item{display:flex;align-items:center;gap:16px;padding:18px 20px;border-bottom:1px solid var(--border);cursor:pointer;transition:background var(--transition);background:#eff6ff}.overview-item:hover{background:#dce8f9}.overview-item__icon-wrap{width:48px;height:48px;border-radius:14px;background:#153b8f;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}.overview-item__icon-wrap svg{width:22px;height:22px}.overview-item__body{flex:1;min-width:0}.overview-item__label{font-family:var(--font-display);font-size:22px;color:var(--ink);line-height:1.2}.overview-item__count{font-size:12px;color:var(--ink-light);margin-top:2px}.overview-item__arrow{width:18px;height:18px;color:var(--ink-xlight);flex-shrink:0}.overview-back{display:flex;align-items:center;gap:6px;padding:10px 16px;font-size:13px;font-weight:500;color:#fff;cursor:pointer;border-bottom:1px solid var(--border);background:#153b8f;flex-shrink:0;transition:background var(--transition)}.overview-back:hover{background:#082a74}.overview-back svg{width:16px;height:16px}@media (max-width: 768px){.overview-back{display:none}}.city-quote{padding:28px 44px 32px;text-align:center;background:#153b8f;flex:1;box-shadow:inset 0 6px 12px -4px #00000040}.city-quote__text{font-family:"DM Serif Text",Georgia,serif;font-style:normal;font-size:17px;color:#fff;line-height:1.55}.city-quote__attribution{font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:#fff9;margin-top:10px}.panel-map{flex:1;position:relative;min-width:0;box-shadow:inset 6px 0 16px -4px #00000024}.city-marker{width:100%;height:100%;border-radius:50%;background-size:cover;background-position:center;border:2.5px solid white;box-shadow:0 2px 10px #0000004d;cursor:pointer;position:relative;overflow:hidden;opacity:0;transition:opacity .4s ease,transform .2s ease,box-shadow .2s ease}.city-marker:hover{transform:scale(1.5);box-shadow:0 8px 28px #00000080}.city-marker__overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0d2661c7;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease}.city-marker:hover .city-marker__overlay{opacity:1}.city-marker__name{color:#fff;font-size:7px;font-weight:700;font-family:IBM Plex Sans,sans-serif;text-align:center;line-height:1.25;padding:0 3px;text-transform:uppercase;letter-spacing:.01em;width:100%;overflow-wrap:break-word}.mapbox-map{width:100%;height:100%}.story-modal-anchor{position:absolute;z-index:20;transform:translate(-50%,calc(-100% - 14px));pointer-events:none;max-width:440px;width:calc(100% - 48px)}.story-modal-arrow{width:0;height:0;border-left:12px solid transparent;border-right:12px solid transparent;border-top:14px solid var(--white);margin:0 auto;filter:drop-shadow(0 3px 3px rgba(0,0,0,.1))}.story-modal{background:var(--white);border-radius:16px;box-shadow:0 8px 48px #00000038;width:100%;padding:28px;position:relative;max-height:70vh;overflow-y:auto;pointer-events:all}.story-modal__close{position:absolute;top:16px;right:16px;background:none;border:none;cursor:pointer;color:var(--ink-light);padding:4px;display:flex;align-items:center;justify-content:center}.story-modal__close svg{width:20px;height:20px}.story-modal__close:hover{color:var(--ink)}.story-modal__header{display:flex;align-items:center;gap:14px;margin-bottom:18px}.story-modal__header-text{flex:1;min-width:0}.story-modal__type{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}.story-modal__channel{font-size:13px;color:var(--ink-light);margin-top:2px}.story-modal__title{font-family:var(--font-display);font-size:28px;color:var(--ink);line-height:1.2;margin-bottom:18px;padding-right:24px}.story-modal__why{font-size:13px;font-weight:600;color:var(--ink-light);margin-bottom:8px}.story-modal__desc{font-size:15px;color:var(--ink);line-height:1.6;margin-bottom:20px}.story-modal__meta{display:flex;align-items:center;gap:10px;margin-bottom:22px;flex-wrap:wrap}.story-modal__quality-label,.story-modal__duration{font-size:13px;color:var(--ink-light)}.story-modal__btn{display:flex;align-items:center;justify-content:center;gap:10px;background:#153b8f;color:#fff;border-radius:10px;padding:14px 20px;font-size:15px;font-weight:600;font-family:var(--font-body);text-decoration:none;transition:background var(--transition)}.story-modal__btn:hover{background:#082a74}.story-modal__btn-icon{width:18px;height:18px;flex-shrink:0}.loading-screen{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--cream);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;z-index:100}.loading-screen__logo{width:64px;height:64px;border-radius:50%;animation:pulse 1.4s ease-in-out infinite}.loading-screen p{font-family:var(--font-display);font-style:italic;color:var(--ink-light);font-size:18px}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.08);opacity:.85}}.quality-stars{display:flex;gap:2px;margin-top:5px}.quality-star{width:13px;height:13px;fill:var(--border);stroke:var(--border);stroke-width:1}.quality-star--filled{fill:var(--accent);stroke:var(--accent)}.mobile-back,.panel-story{display:none}.mini-map{width:100%;height:240px}@media (max-width: 768px){.story-item__icon-podcast,.story-item__icon-video,.story-item__icon--placeholder{width:80px;height:80px}.story-item__icon-podcast{border-radius:18px}html{background:var(--white)}.app{position:fixed;top:0;left:0;right:0;bottom:0;width:auto;height:var(--screen-h, 100dvh);flex-direction:column}.panel-cities__header{padding-top:calc(16px + env(safe-area-inset-top))}.panel-cities{width:auto;height:auto;border-right:none;position:absolute;top:0;left:0;right:0;bottom:0;z-index:20;transform:translate(0);transition:transform var(--drawer-transition)}.panel-cities--hidden{transform:translate(-100%)}.panel-detail{width:auto;height:auto;border-right:none;position:absolute;top:0;left:0;right:0;bottom:0;margin-right:0;z-index:30;transform:translate(100%);transition:transform var(--drawer-transition)}.panel-detail--open{transform:translate(0)}.panel-map{display:none}.city-hero{height:300px}.city-hero__name{font-size:44px}.mobile-back{display:flex;align-items:center;gap:8px;padding:14px 16px;padding-top:max(14px,env(safe-area-inset-top));font-size:15px;color:#fff;cursor:pointer;border-bottom:none;background:linear-gradient(to bottom,rgba(0,0,0,.5) 0%,transparent 100%);flex-shrink:0;font-weight:500;position:absolute;top:0;left:0;right:0;z-index:10}.mobile-back svg{width:18px;height:18px}.panel-story{display:flex;flex-direction:column;position:absolute;top:0;left:0;right:0;bottom:0;width:auto;height:auto;z-index:40;background:var(--white);transform:translate(100%);transition:transform var(--drawer-transition);overflow:hidden}.panel-story--open{transform:translate(0)}.panel-story__scroll{flex:1;overflow-y:auto;overscroll-behavior:contain;padding-bottom:env(safe-area-inset-bottom)}.panel-story__content{padding:24px 20px 20px}.nav-slide-panel{height:100%}.panel-cities__scroll,.stories-scroll,.city-overview{padding-bottom:env(safe-area-inset-bottom)}}@media (min-width: 769px) and (max-width: 1100px){:root{--panel-city: 210px;--panel-detail: 360px}.city-hero{height:220px}.city-hero__name{font-size:44px}}