@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Bengali:wght@400;500;600;700&family=Noto+Serif+Bengali:wght@500;600;700&display=swap');

/* Bengali literary fonts supplied for the premium UI. */
@font-face{
  font-family:"Li Badhon Bidrohi UI";
  src:url("../17-assets/fonts/LiBadhonBidrohiUnicode-Bold.ttf") format("truetype");
  font-style:normal;
  font-weight:700;
  font-display:swap;
}
@font-face{
  font-family:"Li Subha Letterpress UI";
  src:url("../17-assets/fonts/LiSubhaLetterpressUnicode.ttf") format("truetype");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
:root{--paper:#f4ecdc;--paper2:#eadfc9;--ink:#182333;--red:#7d2825;--terra:#ae5b43;--gold:#c59b45;--line:#cdbfa6;--muted:#686055;--white:#fffaf0}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Noto Sans Bengali",sans-serif}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}
.site-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:24px;padding:16px 5vw;border-bottom:1px solid var(--line);background:rgba(244,236,220,.97)}.brand{display:flex;flex-direction:column;min-width:220px}.brand strong{font:700 27px "Noto Serif Bengali";color:var(--red)}.brand span{font-size:11px;color:var(--muted)}.desktop-nav{display:flex;gap:18px;align-items:center;flex:1;font-size:14px}.desktop-nav a:hover{color:var(--red)}.writer-cta{background:var(--terra);color:white;padding:10px 15px;font-weight:700;border-radius:2px;box-shadow:3px 3px 0 var(--gold);white-space:nowrap}.writer-cta.large{padding:14px 20px}.login-link{font-size:13px;color:var(--red)}.mobile-menu{display:none;border:0;background:transparent;color:var(--ink);font-size:25px;line-height:1;padding:4px;cursor:pointer;z-index:31}
.mobile-menu:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.mobile-drawer{display:none}
.mobile-drawer-backdrop{display:none}
.hero{max-width:1200px;margin:auto;padding:72px 5vw 64px;min-height:470px}.editorial-grid{display:grid;grid-template-columns:1.4fr .8fr;gap:60px;align-items:center}.kicker,.tag{font-size:12px;letter-spacing:.06em;color:var(--red);font-weight:700}.hero h1{font:700 clamp(45px,6vw,78px)/1.05 "Noto Serif Bengali";margin:12px 0}.meta{color:var(--muted)}.lead{font-size:18px;line-height:1.9;max-width:650px}.text-button{display:inline-block;margin-top:14px;color:var(--red);font-weight:700;border-bottom:2px solid var(--red);padding-bottom:5px}
.hero-art{min-height:320px;background:var(--ink);color:var(--white);display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;padding:30px;text-align:center;box-shadow:12px 12px 0 var(--gold)}.hero-art:before,.hero-art:after{content:"";position:absolute;border:1px solid var(--gold);inset:18px}.hero-art:after{inset:28px}.alpona{font-size:36px;color:var(--gold);z-index:1}.cover-title{font:700 42px/1.2 "Noto Serif Bengali";z-index:1}.hero-art small{z-index:1;margin-top:20px}
.content-section{max-width:1200px;margin:auto;padding:45px 5vw}.band{background:var(--paper2);max-width:none;padding-left:calc(5vw + (100% - 1200px)/2);padding-right:calc(5vw + (100% - 1200px)/2)}.section-head{display:flex;justify-content:space-between;align-items:end;border-bottom:2px solid var(--ink);padding-bottom:9px;margin-bottom:22px}.section-head h2{font:700 27px "Noto Serif Bengali";margin:0}.section-head h2 span{font:400 14px "Noto Sans Bengali";color:var(--muted)}.section-head a{font-size:13px;color:var(--red)}
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.work-card{border:1px solid var(--line);padding:23px;min-height:220px;background:rgba(255,255,255,.2)}.work-card h3,.story-row h3,.writer-strip h3{font:600 26px "Noto Serif Bengali";margin:8px 0}.work-card p,.story-row p{color:var(--muted);line-height:1.8}.work-card footer{border-top:1px solid var(--line);padding-top:11px;margin-top:22px;font-size:13px;display:flex;justify-content:space-between;color:var(--red)}
.story-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.story-row>div{padding:20px 24px;border-left:4px solid var(--terra)}.writer-strip{display:grid;grid-template-columns:auto 1fr auto auto 1fr auto;gap:15px;align-items:center}.avatar{width:55px;height:55px;border-radius:50%;background:var(--ink);color:var(--gold);display:grid;place-items:center;font:700 23px "Noto Serif Bengali"}.writer-strip h3{margin:0;font-size:21px}.writer-strip p{margin:3px 0;color:var(--muted);font-size:13px}.outline-button{border:1px solid var(--red);padding:7px 12px;color:var(--red);font-size:13px}
.writer-banner{max-width:1200px;margin:35px auto 70px;background:var(--ink);color:#fff;padding:42px 5vw;display:flex;justify-content:space-between;align-items:center;gap:30px}.writer-banner h2{font:700 43px "Noto Serif Bengali";margin:8px 0}.writer-banner p{color:#ddd;line-height:1.8}.writer-banner .kicker{color:#e2b55f}.site-footer{border-top:1px solid var(--line);padding:35px 5vw;text-align:center;color:var(--muted);font-size:13px}
.page{max-width:1100px;margin:auto;padding:55px 5vw}.page h1{font:700 48px "Noto Serif Bengali"}.panel{background:rgba(255,255,255,.25);border:1px solid var(--line);padding:25px;margin:20px 0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field{display:flex;flex-direction:column;gap:7px}.field.full{grid-column:1/-1}.field label{font-weight:700;font-size:13px}.field input,.field textarea,.field select{background:#fffaf0;border:1px solid var(--line);padding:12px;outline:none}.field textarea{min-height:180px;resize:vertical}.primary{border:0;background:var(--terra);color:#fff;padding:12px 18px;font-weight:700;cursor:pointer}.notice{padding:12px;background:var(--paper2);border-left:4px solid var(--gold);margin:15px 0}
@media(max-width:900px){
.desktop-nav{display:none}
.mobile-menu{display:block}
.site-header{gap:12px}.brand{flex:1;min-width:0}.login-link{display:none}.editorial-grid{grid-template-columns:1fr}.hero-art{min-height:260px}.work-grid{grid-template-columns:1fr 1fr}.writer-strip{grid-template-columns:auto 1fr auto}.writer-strip .avatar:nth-of-type(2),.writer-strip .avatar:nth-of-type(2)~*{display:none}}

@media(max-width:900px){
  .mobile-drawer{
    display:flex;
    position:fixed;
    top:0;
    left:0;
    width:min(310px,82vw);
    height:100vh;
    padding:78px 24px 30px;
    flex-direction:column;
    gap:4px;
    background:var(--paper);
    border-right:1px solid var(--line);
    box-shadow:10px 0 30px rgba(24,35,51,.18);
    transform:translateX(-105%);
    transition:transform .22s ease;
    z-index:30;
    overflow-y:auto;
  }
  .mobile-drawer.open{transform:translateX(0)}
  .mobile-drawer a{
    display:block;
    padding:13px 8px;
    border-bottom:1px solid var(--line);
    font-size:15px;
  }
  .mobile-drawer a:hover{color:var(--red)}
  .mobile-drawer .drawer-writer{
    margin-top:12px;
    background:var(--terra);
    color:#fff;
    text-align:center;
    border:0;
  }
  .mobile-drawer-backdrop{
    display:block;
    position:fixed;
    inset:0;
    background:rgba(24,35,51,.35);
    opacity:0;
    pointer-events:none;
    transition:opacity .22s ease;
    z-index:25;
  }
  .mobile-drawer-backdrop.open{opacity:1;pointer-events:auto}
  body.menu-open{overflow:hidden}
}

@media(max-width:600px){.site-header{padding:13px 4vw}.brand strong{font-size:22px}.brand span{font-size:9px}.writer-cta{font-size:12px;padding:9px 10px}.hero{padding:48px 4vw}.hero h1{font-size:46px}.lead{font-size:16px}.content-section{padding:35px 4vw}.work-grid,.story-row{grid-template-columns:1fr}.writer-banner{margin-left:4vw;margin-right:4vw;padding:32px 5vw;display:block}.writer-banner .large{display:inline-block;margin-top:10px}.page{padding:40px 4vw}.page h1{font-size:38px}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}}

.legal-footer{border-top:1px solid var(--line);padding:28px 5vw 36px;text-align:center;color:var(--muted);font-size:12px;background:var(--paper2)}
.legal-footer .copyright-mark{display:inline-flex;width:24px;height:24px;border:1px solid var(--red);border-radius:50%;align-items:center;justify-content:center;color:var(--red);font-weight:700;margin-right:7px}
.legal-footer .footer-brand{font:700 18px "Noto Serif Bengali";color:var(--red)}
.legal-footer .footer-links{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;margin-top:12px}
.legal-footer .footer-links a{text-decoration:underline;text-underline-offset:3px}
.publish-declaration{background:var(--paper2);border:1px solid var(--line);padding:16px;margin:18px 0}
.publish-declaration label{display:flex;gap:10px;align-items:flex-start;line-height:1.7;font-size:14px}
.publish-declaration input{margin-top:5px;accent-color:var(--terra)}
.legal-box{max-width:800px;margin:25px auto;line-height:1.9}
@media(max-width:600px){.legal-footer .footer-links{gap:10px 14px}.legal-footer{padding-left:4vw;padding-right:4vw}}

/* =========================================================
   JAGO BANGALI — SHARED APP LOADER
   Small vector-stroke liquid logo + text + progress bar
   ========================================================= */

.jb-loader{
  position:fixed;
  inset:0;
  z-index:999999;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--paper,#f4ecdc);
  opacity:1;
  visibility:visible;
  transition:opacity .35s ease,visibility .35s ease;
}
.jb-loader.done,
.jb-loader.is-done{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.jb-loader-box{
  width:96px;
  text-align:center;
}
.jb-liquid-logo{
  width:68px;
  height:63px;
  margin:0 auto;
}
.jb-liquid-svg{
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
}
.jb-liquid-rect{
  transform:translateY(100%);
  animation:jb-liquid-rise 1.7s cubic-bezier(.2,.78,.22,1) forwards;
}
.jb-liquid-wave{
  transform-box:fill-box;
  transform-origin:center;
  animation:jb-liquid-wave 1s ease-in-out infinite;
}
.jb-loader-logo-outline{pointer-events:none}
.jb-loader-title{
  margin-top:10px;
  color:var(--red,#7d2825);
  font:700 15px/1.3 "Noto Serif Bengali",sans-serif;
  white-space:nowrap;
}
.jb-loader-subtitle{
  margin-top:2px;
  color:var(--muted,#686055);
  font:400 9px/1.4 "Noto Sans Bengali",sans-serif;
}
.jb-loader-bar{
  width:76px;
  height:3px;
  margin:9px auto 0;
  overflow:hidden;
  border-radius:99px;
  background:var(--line,#cdbfa6);
}
.jb-loader-bar span{
  display:block;
  width:0;
  height:100%;
  background:var(--terra,#ae5b43);
  animation:jb-loader-progress 1.9s cubic-bezier(.22,.78,.25,1) forwards;
}
@keyframes jb-liquid-rise{
  from{transform:translateY(100%)}
  to{transform:translateY(0)}
}
@keyframes jb-liquid-wave{
  0%,100%{transform:translateX(-2px) scaleY(.9)}
  50%{transform:translateX(2px) scaleY(1.1)}
}
@keyframes jb-loader-progress{
  0%{width:0}
  85%{width:88%}
  100%{width:100%}
}
body.jb-page-enter{
  animation:jb-page-enter .4s ease both;
}
@keyframes jb-page-enter{
  from{opacity:0;transform:translateY(7px)}
  to{opacity:1;transform:translateY(0)}
}
button,.primary,.writer-cta,.outline-button,.text-button{
  -webkit-tap-highlight-color:transparent;
}
@media (hover:hover) and (pointer:fine){
  button:not(:disabled),.primary,.writer-cta,.outline-button{
    transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease;
  }
  button:not(:disabled):hover,.primary:hover,.writer-cta:hover,.outline-button:hover{
    transform:translateY(-1px);
  }
}
@media (max-width:600px){
  .jb-loader-box{width:88px}
  .jb-liquid-logo{width:62px;height:58px}
  .jb-loader-title{font-size:14px}
  .jb-loader-bar{width:72px}
}
@media (prefers-reduced-motion:reduce){
  .jb-loader,.jb-liquid-rect,.jb-liquid-wave,.jb-loader-bar span,
  body.jb-page-enter,button,.primary,.writer-cta,.outline-button{
    animation:none!important;
    transition:none!important;
  }
  .jb-liquid-rect{transform:translateY(0)}
}

/* =========================================================
   JAGO BANGALI — PREMIUM LITERARY UI v1
   Mobile-first visual layer. Existing data/auth/layout logic
   is intentionally left intact; these rules refine presentation.
   ========================================================= */
:root{
  --jb-paper:#f5eddd;
  --jb-paper-deep:#e9dcc4;
  --jb-paper-light:#fbf6ea;
  --jb-ink:#29231f;
  --jb-burgundy:#742b28;
  --jb-burgundy-dark:#55201f;
  --jb-rust:#a75a43;
  --jb-gold:#bd9147;
  --jb-line:rgba(105,73,47,.20);
  --jb-shadow:0 12px 32px rgba(70,43,25,.10);
  --jb-shadow-soft:0 6px 20px rgba(70,43,25,.07);
}

html{background:var(--jb-paper)}
body{
  background:
    radial-gradient(circle at 12% 8%,rgba(255,255,255,.58),transparent 30%),
    radial-gradient(circle at 88% 20%,rgba(184,142,83,.07),transparent 28%),
    linear-gradient(180deg,var(--jb-paper-light) 0%,var(--jb-paper) 42%,#f1e7d3 100%);
  color:var(--jb-ink);
  font-family:"Noto Sans Bengali",sans-serif;
  -webkit-font-smoothing:antialiased;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.34;
  background-image:
    radial-gradient(rgba(74,49,29,.10) .55px,transparent .7px),
    radial-gradient(rgba(255,255,255,.25) .6px,transparent .8px);
  background-size:17px 17px,23px 23px;
  background-position:0 0,7px 9px;
}

a{transition:color .18s ease,opacity .18s ease,transform .18s ease}

.site-header{
  min-height:68px;
  padding:11px clamp(14px,4vw,54px);
  gap:14px;
  border-bottom:1px solid var(--jb-line);
  background:rgba(248,241,227,.90);
  box-shadow:0 5px 24px rgba(73,43,24,.06);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.brand strong{
  color:var(--jb-burgundy);
  font-family:"Noto Serif Bengali",serif;
  letter-spacing:.015em;
}
.brand span{color:#756b5d}
.desktop-nav a{border-radius:999px;transition:background .18s ease,color .18s ease,transform .18s ease}
.desktop-nav a:hover{color:var(--jb-burgundy);background:rgba(116,43,40,.06);transform:translateY(-1px)}

.writer-cta,
.primary{
  border-radius:14px;
  background:linear-gradient(135deg,var(--jb-burgundy),var(--jb-rust));
  box-shadow:0 7px 16px rgba(116,43,40,.17);
  border:1px solid rgba(255,255,255,.16);
}
.writer-cta:hover,.primary:hover{box-shadow:0 10px 22px rgba(116,43,40,.23)}
.login-link{padding:8px 11px;border-radius:999px}

.hero{
  padding-top:clamp(42px,7vw,78px);
  padding-bottom:clamp(40px,6vw,70px);
}
.hero-copy{max-width:720px}
.kicker,.tag{
  color:var(--jb-burgundy);
  letter-spacing:.075em;
}
.hero h1,.page h1,.section-head h2,.work-card h3,.story-row h3,.writer-strip h3,.writer-banner h2{
  font-family:"Noto Serif Bengali",serif;
  color:var(--jb-ink);
}
.hero h1{letter-spacing:-.015em;text-wrap:balance}
.lead{color:#5e554b}

.hero-art{
  border-radius:28px;
  background:
    radial-gradient(circle at 70% 20%,rgba(210,165,90,.15),transparent 28%),
    linear-gradient(145deg,#302824,#171513);
  box-shadow:var(--jb-shadow),12px 12px 0 rgba(189,145,71,.65);
  overflow:hidden;
}
.hero-art:before,.hero-art:after{border-radius:18px}

.content-section{padding-top:clamp(34px,5vw,54px);padding-bottom:clamp(34px,5vw,54px)}
.band{background:rgba(233,220,196,.48)}
.section-head{border-bottom:1px solid var(--jb-line);position:relative}
.section-head::after{
  content:"";
  position:absolute;
  left:0;bottom:-2px;width:44px;height:3px;border-radius:99px;background:var(--jb-burgundy);
}
.section-head h2{letter-spacing:.005em}

.work-grid{gap:18px}
.work-card,.panel{
  border:1px solid var(--jb-line);
  border-radius:20px;
  background:rgba(255,250,240,.58);
  box-shadow:var(--jb-shadow-soft);
  overflow:hidden;
  transition:transform .25s cubic-bezier(.22,1,.36,1),box-shadow .25s ease,border-color .2s ease;
}
.work-card:hover,.panel:hover{
  transform:translateY(-3px);
  box-shadow:0 15px 34px rgba(70,43,25,.12);
  border-color:rgba(116,43,40,.28);
}
.work-card h3{line-height:1.45}
.work-card p,.story-row p{color:#6b6257}
.work-card footer{border-top:1px solid var(--jb-line);color:var(--jb-burgundy)}
.text-button,.outline-button{border-radius:999px}
.text-button{border-bottom:0;padding:7px 12px;background:rgba(116,43,40,.07)}
.text-button:hover{background:rgba(116,43,40,.12);transform:translateX(2px)}
.outline-button{border-color:rgba(116,43,40,.45)}

.writer-strip{gap:12px}
.avatar{border:2px solid rgba(189,145,71,.48);box-shadow:0 5px 14px rgba(70,43,25,.10)}
.writer-banner{
  border-radius:26px;
  box-shadow:var(--jb-shadow);
  background:
    radial-gradient(circle at 88% 30%,rgba(189,145,71,.17),transparent 26%),
    linear-gradient(145deg,#332925,#211b19);
}
.site-footer,.legal-footer{background:rgba(233,220,196,.48)}

.field input,.field textarea,.field select{
  border-radius:14px;
  border:1px solid var(--jb-line);
  background:rgba(255,250,240,.78);
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}
.field input:focus,.field textarea:focus,.field select:focus{
  border-color:rgba(116,43,40,.48);
  box-shadow:0 0 0 4px rgba(116,43,40,.08);
  background:#fffaf0;
}
.notice,.publish-declaration{border-radius:16px;border:1px solid var(--jb-line);border-left:4px solid var(--jb-gold)}

/* Shared animated reveal */
.jb-reveal{animation:jb-reveal-in .55s cubic-bezier(.22,1,.36,1) both}
@keyframes jb-reveal-in{
  from{opacity:0;transform:translateY(13px)}
  to{opacity:1;transform:translateY(0)}
}

/* Typewriter-style character reveal */
.jb-typewriter{display:block;font-family:"Li Badhon Bidrohi UI","Noto Serif Bengali",serif;font-weight:700;letter-spacing:.005em}
.jb-type-char{
  display:inline-block;
  font-family:inherit;
  font-weight:700;
  opacity:0;
  transform:translateY(3px);
  animation:jb-type-char .035s linear var(--jb-delay) forwards;
}
@keyframes jb-type-char{
  to{opacity:1;transform:none}
}

/* Mobile app shell */
@media(max-width:600px){
  html{scroll-padding-top:74px}
  body{font-size:15px}
  .site-header{
    min-height:62px;
    padding:9px 12px;
    border-bottom:1px solid rgba(105,73,47,.16);
    border-radius:0 0 18px 18px;
  }
  .brand strong{font-size:20px!important;line-height:1.15}
  .brand span{font-size:8.5px!important}

  .site-header .mobile-menu{
    display:inline-flex!important;
    order:3!important;
    flex:0 0 42px!important;
    width:42px!important;height:42px!important;
    align-items:center;justify-content:center;
    border:1px solid rgba(116,43,40,.15)!important;
    border-radius:13px!important;
    background:rgba(255,250,240,.70)!important;
    color:var(--jb-burgundy)!important;
    box-shadow:0 4px 12px rgba(70,43,25,.08);
  }
  .site-header .mobile-menu:active{transform:scale(.94)}

  .site-header .homepage-auth-actions{gap:5px!important}
  .site-header .homepage-auth-actions a,.site-header .homepage-auth-actions button{
    min-height:38px!important;
    border-radius:999px!important;
  }
  .site-header .writer-cta{padding:7px 9px!important;font-size:11px!important;box-shadow:none}
  .site-header .login-link{font-size:11px!important}

  .site-header .desktop-nav{
    top:calc(100% + 9px)!important;
    left:10px!important;right:10px!important;
    border:1px solid rgba(105,73,47,.16)!important;
    border-radius:20px!important;
    background:rgba(250,244,233,.97)!important;
    box-shadow:0 22px 50px rgba(55,35,21,.20)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
  }
  .site-header .desktop-nav a{
    min-height:46px!important;
    padding:11px 14px!important;
    border-radius:13px!important;
    font-size:14px!important;
  }
  .site-header .desktop-nav a:active{background:rgba(116,43,40,.10)}

  .mobile-drawer{
    width:min(330px,88vw)!important;
    padding:76px 16px 28px!important;
    background:rgba(250,244,233,.98)!important;
    border-right:1px solid rgba(105,73,47,.16)!important;
    border-radius:0 24px 24px 0!important;
    box-shadow:18px 0 50px rgba(55,35,21,.22)!important;
    transition:transform .42s cubic-bezier(.22,1,.36,1)!important;
  }
  .mobile-drawer a{
    border:0!important;
    border-radius:13px!important;
    padding:13px 14px!important;
    margin:2px 0!important;
  }
  .mobile-drawer a:hover{background:rgba(116,43,40,.07)}
  .mobile-drawer .drawer-writer{border-radius:14px!important;margin-top:10px!important}
  .mobile-drawer-backdrop{backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}

  .hero{
    padding:28px 12px 32px!important;
    min-height:0!important;
  }
  .editorial-grid{gap:20px!important}
  .hero h1{font-size:clamp(34px,11vw,52px)!important;line-height:1.15!important}
  .lead{font-size:15px!important;line-height:1.85!important}
  .hero-art{
    min-height:235px!important;
    border-radius:22px!important;
    box-shadow:0 12px 28px rgba(55,35,21,.16)!important;
  }
  .cover-title{font-size:32px!important}

  .content-section{padding:28px 12px!important}
  .band{padding-left:12px!important;padding-right:12px!important}
  .section-head{
    padding-bottom:10px!important;margin-bottom:15px!important;gap:7px!important;
  }
  .section-head h2{font-size:21px!important;line-height:1.45!important}
  .section-head h2 span{font-size:11px!important}
  .section-head a{font-size:11px!important}

  .work-grid{gap:12px!important}
  .work-card{
    min-height:0!important;
    padding:16px!important;
    border-radius:18px!important;
    background:rgba(255,250,240,.72)!important;
    box-shadow:0 7px 20px rgba(70,43,25,.08)!important;
  }
  .work-card h3{font-size:21px!important;margin:6px 0!important}
  .work-card p{font-size:13px!important;line-height:1.75!important}
  .work-card footer{margin-top:14px!important;padding-top:9px!important;font-size:11px!important}
  .work-card .text-button{margin-top:9px!important;font-size:12px!important}

  .panel{padding:18px!important;border-radius:18px!important}
  .page{padding:28px 12px!important}
  .page h1{font-size:34px!important;line-height:1.25!important}
  .page > .panel{margin-top:16px!important}
  .form-grid{gap:12px!important}
  .field input,.field textarea,.field select{padding:12px!important;border-radius:13px!important}

  .writer-banner{
    margin:22px 12px 42px!important;
    padding:25px 18px!important;
    border-radius:22px!important;
  }
  .writer-banner h2{font-size:30px!important;line-height:1.25!important}
  .writer-banner p{font-size:13px!important}
  .writer-banner .writer-cta.large{border-radius:14px!important}

  .legal-footer{border-radius:20px 20px 0 0;margin-top:18px}
}

@media(max-width:380px){
  .site-header .homepage-auth-actions{max-width:46%;overflow:hidden}
  .site-header .writer-cta{font-size:10px!important;padding:6px 7px!important}
  .site-header .mobile-menu{flex-basis:40px!important;width:40px!important;height:40px!important}
}

@media(prefers-reduced-motion:reduce){
  .jb-reveal,.jb-type-char{animation:none!important;opacity:1!important;transform:none!important}
  a,.work-card,.panel,.mobile-drawer,.mobile-menu{transition:none!important}
}

/* Typewriter cursor — subtle old typewriter-machine detail */
.jb-typewriter::after{
  content:"▌";
  display:inline-block;
  margin-left:3px;
  color:var(--jb-burgundy);
  font-size:.72em;
  animation:jb-type-cursor .8s steps(1,end) infinite;
}
@keyframes jb-type-cursor{50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.jb-typewriter::after{animation:none}}

/* Reusable content Share / Copy Link controls */
.jb-share-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:16px 0 22px;padding:10px 0}
.jb-share-btn{appearance:none;border:1px solid var(--line,#cdbfa6);background:var(--white,#fffaf0);color:var(--ink,#182333);min-height:42px;padding:9px 14px;border-radius:999px;font:700 14px/1.2 "Noto Sans Bengali",sans-serif;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:transform .15s ease,background .15s ease,border-color .15s ease}
.jb-share-btn:hover{transform:translateY(-1px);border-color:var(--red,#7d2825)}
.jb-share-btn:focus-visible{outline:2px solid var(--red,#7d2825);outline-offset:2px}
.jb-share-primary{background:var(--red,#7d2825);color:#fff;border-color:var(--red,#7d2825)}
.jb-share-btn.is-copied{background:var(--terra,#ae5b43);color:#fff;border-color:var(--terra,#ae5b43)}
.jb-share-status{min-height:22px;color:var(--red,#7d2825);font-size:13px;font-weight:700}
@media(max-width:600px){.jb-share-tools{gap:7px;margin:12px 0 18px}.jb-share-btn{flex:1;min-width:0;min-height:44px;padding:9px 10px;font-size:13px}.jb-share-status{width:100%;text-align:left;padding-left:4px}}
