@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;1,500&display=swap');
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f5f3ee;color:#171b18;font-family:"DM Sans",sans-serif}.topbar{height:72px;background:#fff;border-bottom:1px solid #dedbd2;position:sticky;top:0;z-index:50}.topInner{height:100%;max-width:1320px;margin:auto;padding:0 20px;display:flex;align-items:center;gap:18px}.logo{color:#171b18;text-decoration:none;letter-spacing:2.4px;white-space:nowrap}.logo span{font-size:24px;margin-right:8px}.topInner nav{display:flex;gap:22px;margin-left:28px}.topInner nav a{font-size:13px;font-weight:700;color:#53574f;text-decoration:none}.topActions{margin-left:auto;display:flex;align-items:center;gap:8px}.iconBtn,.profileDot{border:0;background:transparent;font-size:22px;cursor:pointer;padding:7px}.profileDot{font-size:20px}.shareBtn{border:0;background:#18221c;color:#fff;border-radius:5px;padding:11px 15px;font-weight:800;cursor:pointer}.feedWrap{max-width:1320px;margin:auto;display:grid;grid-template-columns:180px minmax(0,720px) 300px;gap:24px;padding:25px 20px 50px}.leftRail{padding-top:4px}.rail{width:100%;border:0;background:transparent;text-align:left;padding:13px 15px;border-radius:7px;font-weight:700;color:#555b53;cursor:pointer;font-size:14px}.rail.active,.rail:hover{background:#eae7df;color:#18221c}.rail span{margin-left:10px}.composer{background:#fff;border:1px solid #dfdbd2;border-radius:9px;padding:14px;display:flex;align-items:center;gap:10px;cursor:pointer;box-shadow:0 2px 8px #00000006}.fakeAvatar{width:40px;height:40px;border-radius:50%;background:#e9e2d4;display:flex;align-items:center;justify-content:center}.composerText{flex:1;color:#888d85;font-size:14px}.composer button{border:0;background:#e7dfd0;border-radius:50%;width:35px;height:35px;font-size:20px}.feedTools{display:flex;gap:8px;margin:15px 0}.feedTools input,.feedTools select,.filters input,.filters select{border:1px solid #d9d5cc;background:#fff;border-radius:5px;padding:11px 12px;font:inherit}.feedTools input{flex:1}.story{background:#fff;border:1px solid #dedbd3;border-radius:9px;margin-bottom:17px;overflow:hidden;box-shadow:0 2px 8px #00000004}.storyHead{padding:15px 17px;display:flex;align-items:center;gap:10px}.storyHead .avatar{width:42px;height:42px;border-radius:50%;background:#ebe4d6;display:flex;align-items:center;justify-content:center}.storyHead .name{font-weight:800;font-size:14px}.storyHead small{display:block;color:#7b7f77;font-size:11px;margin-top:3px}.followBtn{margin-left:auto;border:1px solid #bbb4a7;background:#fff;border-radius:5px;padding:8px 12px;font-weight:750;cursor:pointer}.dots{border:0;background:none;font-size:20px;cursor:pointer}.storyBody{padding:0 17px 14px}.storyBody .meta{font-size:9px;letter-spacing:1.3px;color:#947d5a;text-transform:uppercase}.storyBody h2{font:500 29px/1.15 "Playfair Display",serif;margin:8px 0}.storyBody p{font-size:14px;color:#565c54;line-height:1.6;margin:0 0 13px}.storyPhoto{height:300px;background:linear-gradient(135deg,#283a31,#96764b);display:flex;align-items:center;justify-content:center;font-size:80px}.storyFooter{padding:11px 17px;border-top:1px solid #eeeae2}.statsLine{display:flex;justify-content:space-between;color:#777c74;font-size:11px;padding-bottom:10px}.actions{display:flex;border-top:1px solid #eeeae2;padding-top:9px}.actions button{flex:1;border:0;background:none;padding:8px;color:#52584f;font-weight:700;cursor:pointer}.actions button:hover{background:#f3f0e9;border-radius:5px}.readCountries{display:flex;align-items:center;gap:7px;color:#697067;font-size:11px;margin-top:8px}.readCountries b{color:#20251f}.rightRail{display:flex;flex-direction:column;gap:15px}.sideCard{background:#fff;border:1px solid #dfdbd2;border-radius:8px;padding:17px}.sideCard h3{font:600 19px "Playfair Display",serif;margin:0 0 12px}.sideCard button{width:100%;border:0;background:transparent;text-align:left;padding:10px 0;cursor:pointer;color:#4d534c;font-weight:650;border-bottom:1px solid #eee9df}.sideCard button b{float:right}.sideCard p{font-size:12px;line-height:1.6;color:#777d74}.popular{display:flex;align-items:center;gap:9px;padding:8px 0}.popular .pf{font-size:23px}.popular small{color:#888}.sectionBlock{max-width:1320px;margin:auto;padding:65px 20px}.countries{background:#f5f3ee}.blockHead{display:flex;justify-content:space-between;align-items:end;gap:25px}.blockHead small{font-size:10px;letter-spacing:3px;color:#9a8666;font-weight:800}.blockHead h2{font:500 48px "Playfair Display",serif;margin:7px 0}.blockHead p{color:#70766d}.filters{display:flex;gap:8px}.countryGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:13px;margin-top:28px}.country{background:#fff;border:1px solid #dfdbd2;border-radius:8px;padding:16px;cursor:pointer}.country:hover{box-shadow:0 12px 28px #0000000b}.country .flag{font-size:35px}.country h3{margin:8px 0 3px}.country small{font-size:9px;letter-spacing:1.3px;color:#9a8566;text-transform:uppercase}.peopleBlock{background:#ece9e1;max-width:none;padding-left:max(20px,calc((100% - 1280px)/2));padding-right:max(20px,calc((100% - 1280px)/2))}.peopleGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}.person{background:#fff;border:1px solid #ded9ce;border-radius:8px;padding:17px;display:flex;gap:11px;align-items:center}.person .avatar{width:50px;height:50px;border-radius:50%;background:#e9e0d1;display:flex;align-items:center;justify-content:center;font-size:22px}.person small{display:block;color:#888;margin-top:3px}.person .followBtn{margin-left:auto}footer{background:#141b15;color:#eee;padding:35px 7%;display:flex;justify-content:space-between}footer span{color:#aeb5ac}.modal{display:none;position:fixed;inset:0;background:#0d120edb;z-index:100;align-items:center;justify-content:center;padding:15px}.modal.show{display:flex}.modalBox{background:#faf9f5;width:100%;max-width:850px;max-height:93vh;overflow:auto;border-radius:10px;padding:30px}.close{float:right;border:0;background:none;font-size:31px;cursor:pointer}.modalBox h2{font:500 40px "Playfair Display",serif;margin:5px 0 15px}.modalBox label{display:block;font-size:12px;font-weight:800;margin:15px 0}.modalBox input,.modalBox select,.modalBox textarea{width:100%;display:block;margin-top:6px;padding:12px;border:1px solid #d7d2c8;border-radius:5px;background:#fff;font:inherit}.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.primary{background:#d8b66e;border:0;padding:13px 18px;border-radius:5px;font-weight:800;cursor:pointer}.full{width:100%;margin-top:10px}.notice{padding:12px;background:#eee7da;border-left:3px solid #c7a566;font-size:12px;line-height:1.5}.readTop{display:flex;gap:10px;align-items:center}.readTitle{font:500 45px "Playfair Display",serif}.readStory{font:17px/1.8 "Playfair Display",serif;color:#444;white-space:pre-wrap}.analytics{margin-top:20px;border:1px solid #ded9cf;border-radius:8px;background:#fff;padding:18px}.analyticsTabs{display:flex;gap:20px;border-bottom:1px solid #eee7dc;padding-bottom:10px}.analyticsTabs button{border:0;background:none;font-weight:700;padding:8px;cursor:pointer}.analyticsTabs .on{border-bottom:2px solid #1d261f}.metricGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:14px 0}.metric{padding:14px;background:#f5f2eb;border-radius:6px}.metric small{color:#777}.metric b{display:block;font-size:22px;margin-top:5px}.countryRow{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid #eee8df;font-size:13px}.badge{display:inline-block;background:#e9dfca;border-radius:20px;padding:7px 10px;font-size:10px;font-weight:800;margin:4px}.langRow{display:flex;gap:8px;align-items:end;margin-top:18px}.langRow label{flex:1;margin:0}.langRow button{height:43px}.error{color:#a44e46}.ok{color:#52754b}@media(max-width:1000px){.feedWrap{grid-template-columns:70px minmax(0,1fr)}.leftRail span{display:none}.rightRail{display:none}.rail{text-align:center}.blockHead{flex-direction:column;align-items:flex-start}}@media(max-width:650px){.topInner nav{display:none}.logo{font-size:13px}.shareBtn{font-size:12px;padding:9px}.feedWrap{display:block;padding:15px 10px}.leftRail{display:flex;gap:5px;overflow:auto;margin-bottom:12px}.rail{min-width:90px;text-align:center}.sectionBlock{padding:50px 14px}.blockHead h2{font-size:38px}.filters{width:100%;flex-direction:column}.storyPhoto{height:230px}.storyBody h2{font-size:25px}.two{grid-template-columns:1fr}.readTitle{font-size:36px}.metricGrid{grid-template-columns:1fr}footer{flex-direction:column;gap:10px}}
/* Responsive navigation + mobile drawer */
.menuBtn{display:none}
.mobileTabs{display:none}
.drawerOverlay{display:none}
.mobileDrawer{display:none}
@media(max-width:1000px){
  .menuBtn{display:block}
}
@media(max-width:650px){
  body{overflow-x:hidden}
  .topbar{height:64px}
  .topInner{padding:0 10px;gap:6px}
  .topInner nav{display:none}
  .topActions{gap:1px}
  .topActions .iconBtn:first-child{display:none}
  .profileDot{font-size:18px}
  .shareBtn{font-size:11px;padding:9px 10px}
  .logo{font-size:12px;letter-spacing:2px}
  .logo span{font-size:20px;margin-right:5px}
  .mobileTabs{height:58px;display:flex;position:sticky;top:64px;z-index:40;background:#fff;border-bottom:1px solid #ddd9d0;box-shadow:0 2px 8px #00000008}
  .mobileTabs button{flex:1;border:0;background:#fff;color:#62675f;font-size:20px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
  .mobileTabs button span{font-size:9px;font-weight:800;letter-spacing:.3px}
  .mobileTabs button.on{color:#18221c;background:#ece9e1}
  .feedWrap{display:block;padding:12px 10px 40px}
  .leftRail{display:none}
  .rightRail{display:none}
  .mainFeed{width:100%;min-width:0}
  .composer{min-height:74px}
  .composerText{font-size:13px;line-height:1.35}
  .feedTools{display:grid;grid-template-columns:minmax(0,1fr) 110px}
  .feedTools input,.feedTools select{min-width:0;width:100%;font-size:13px}
  .story{width:100%;margin-bottom:13px}
  .storyHead{padding:12px}
  .storyHead .avatar{width:39px;height:39px}
  .storyHead .name{font-size:13px}
  .storyHead small{font-size:10px;max-width:170px;line-height:1.3}
  .followBtn{padding:7px 9px;font-size:11px}
  .dots{font-size:16px}
  .storyBody{padding:0 12px 12px}
  .storyBody h2{font-size:24px;line-height:1.12}
  .storyBody p{font-size:13px;line-height:1.55}
  .storyPhoto{height:235px;font-size:70px}
  .storyFooter{padding:10px 12px}
  .statsLine{font-size:10px;gap:8px}
  .readCountries{font-size:10px;flex-wrap:wrap}
  .actions{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}
  .actions button{font-size:10px;padding:9px 3px;white-space:nowrap}
  .actions button:last-child{grid-column:1/-1}
  .sectionBlock{padding:48px 14px}
  .blockHead{display:block}
  .blockHead h2{font-size:36px;line-height:1.05}
  .blockHead p{font-size:13px}
  .filters{display:grid;grid-template-columns:1fr 120px}
  .filters input,.filters select{width:100%;min-width:0}
  .countryGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .country{padding:13px}
  .country .flag{font-size:30px}
  .country h3{font-size:14px;line-height:1.2}
  .peopleGrid{grid-template-columns:1fr}
  .modalBox{padding:22px 16px;border-radius:9px}
  .modalBox h2{font-size:34px}
  .readTitle{font-size:34px}
  .readStory{font-size:16px}
  .analytics{padding:13px}
  .metricGrid{grid-template-columns:1fr 1fr}
  .langRow{display:grid;grid-template-columns:1fr 100px 70px;width:100%}
  .langRow label{min-width:0}
  .langRow button{font-size:11px;padding:8px}
  footer{padding:28px 20px}
  /* Actual hamburger drawer */
  .drawerOverlay{position:fixed;inset:0;background:#07100999;z-index:90}
  .drawerOverlay.open{display:block}
  .mobileDrawer{position:fixed;left:0;top:0;bottom:0;width:min(330px,88vw);background:#faf9f5;z-index:100;display:block;transform:translateX(-105%);transition:transform .22s ease;box-shadow:10px 0 30px #00000022;overflow:auto}
  .mobileDrawer.open{transform:translateX(0)}
  .drawerHead{height:64px;padding:0 17px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ddd8ce;letter-spacing:2px}
  .drawerHead button{border:0;background:none;font-size:30px;cursor:pointer}
  .drawerProfile{display:flex;align-items:center;gap:11px;padding:17px;border-bottom:1px solid #e7e2d8;cursor:pointer}
  .drawerAvatar{width:45px;height:45px;border-radius:50%;background:#e8e0d2;display:flex;align-items:center;justify-content:center}
  .drawerProfile small{display:block;color:#858a82;font-size:11px;margin-top:3px}
  .mobileDrawer>button:not(.drawerHead button){width:100%;border:0;background:transparent;text-align:left;padding:14px 19px;font-size:14px;font-weight:700;color:#4e554d;cursor:pointer}
  .mobileDrawer>button:not(.drawerHead button):hover{background:#ece9e1}
  .mobileDrawer>button span{margin-left:10px}
  .drawerFoot{margin:20px;padding:15px;background:#ece7dc;border-radius:7px;font-size:11px;color:#6f746c;line-height:1.5}
}

@media(max-width:650px){
 body{overflow-x:hidden}
 .mobileDrawer{display:block!important;position:fixed!important;left:0!important;top:0!important;bottom:0!important;width:min(330px,88vw)!important;z-index:100!important;transform:translateX(-105%);transition:transform .22s ease;overflow:auto;background:#faf9f5;box-shadow:10px 0 30px #0003}
 .mobileDrawer.open{transform:translateX(0)!important}
 .drawerOverlay{position:fixed!important;inset:0!important;z-index:90!important;background:#07100999}
 .drawerOverlay:not(.open){display:none!important}.drawerOverlay.open{display:block!important}
 .mobileTabs{position:sticky!important;top:64px!important;z-index:40!important}
 .feedWrap{display:block!important;width:100%!important}
 .mainFeed{width:100%!important;min-width:0!important}
 .story{width:100%!important}
 .actions{grid-template-columns:repeat(3,1fr)!important}
 .actions button:last-child{grid-column:auto!important}
}