@charset "utf-8";

/* ==========================================================================
   《青藤》归档站 · 样式
   设计令牌全部来自 契约.md §五，本文件不出现任何自创色值。
   理性扁平：1px 描边 + 纯色底，单一层级，无渐变 / 无阴影 / 无 3D / 无装饰插画。
   ========================================================================== */

:root{
  /* —— 契约 §五 令牌（原样照抄，禁止改值） —— */
  --ink:        #1F3A32;
  --vine:       #2E6F5E;
  --paper:      #FBFAF7;
  --text:       #23262B;
  --muted:      #6B7078;
  --rule:       #E3E1DA;
  --seal:       #7E1C1D;  /* 校徽主色（取自真实校徽采样） */
  --seal-soft:  #F2E4E4;  /* 校徽色的极浅底 */
  --seal-dark:      #C4707A;  /* 校徽主色的深色纸面变体（契约 §五 冻结字面值，不做 color-mix） */
  --seal-soft-dark: #3A2426;  /* 校徽色的深色极浅底（其上可放正文/次要文字） */
  --warn:       #A8621B;

  --font-serif: "Noto Serif SC","Source Han Serif SC","Songti SC",STSong,SimSun,serif;
  --font-sans:  "Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;

  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px;

  --radius: 0;
  --border: 1px solid var(--rule);

  /* —— 令牌组合（不引入新色值，只做别名，便于深色模式对调） —— */
  --focus: var(--vine);
  --link: var(--vine);
  --fill-invert-bg: var(--ink);
  --fill-invert-fg: var(--paper);
  --cover-ratio: 1240 / 1754;
  --wrap: 1180px;
}

@media (prefers-color-scheme: dark){
  :root{
    --paper:#16191C; --text:#E8E6E1; --muted:#9AA0A6; --rule:#2C3136; --ink:#D9E4DF;
    /* 深色下 --vine 与底色对比不足，链接与焦点环改用 --ink（仍是契约令牌） */
    --focus: var(--ink);
    --link: var(--ink);
    /* 印章色与它的底色在深色纸面上有各自的冻结变体（契约 §五）：直接换令牌，不做颜色计算。
       深色下"总第 N 期"小字、导航下划线、校园影像定位方块都靠这一行才达标。 */
    --seal: var(--seal-dark);
    --seal-soft: var(--seal-soft-dark);
  }
}

/* --------------------------------------------------------------- 基础 —— */

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--paper);
  color:var(--text);
  font-family:var(--font-sans);
  font-size:16px;
  line-height:1.65;
  text-underline-offset:.22em;
}

h1,h2,h3,h4{
  font-family:var(--font-serif);
  font-weight:600;
  line-height:1.25;
  margin:0 0 var(--s4);
  letter-spacing:.01em;
}

p{ margin:0 0 var(--s4); }
ul,ol{ margin:0 0 var(--s4); padding-left:1.3em; }
li{ margin-bottom:var(--s2); }

a{ color:var(--link); text-decoration:underline; }
a:hover{ color:var(--text); }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--focus);
  outline-offset:2px;
}

img{ max-width:100%; height:auto; }

button,input,select{ font:inherit; color:inherit; }

:target{ scroll-margin-top:calc(var(--s8) + var(--s5)); }

hr,.rule{ border:0; border-top:var(--border); margin:var(--s6) 0; }

[hidden]{ display:none !important; }

.wrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding:0 var(--s4); }

.sr-only{
  position:absolute; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0;
}

.skip-link{
  position:absolute; left:var(--s4); top:calc(-1 * var(--s8));
  z-index:40; padding:var(--s3) var(--s4);
  background:var(--fill-invert-bg); color:var(--fill-invert-fg);
  text-decoration:none; border:var(--border);
}
.skip-link:focus{ top:var(--s2); color:var(--fill-invert-fg); }

.sep{ color:var(--muted); margin:0 var(--s2); }

/* ------------------------------------------------------------- 站头尾 —— */

.site-header{
  background:var(--paper);
  border-bottom:var(--border);
}

.site-header__inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--s4); flex-wrap:wrap;
  padding-top:var(--s4); padding-bottom:var(--s4);
}

.brand{
  display:flex; align-items:center; gap:var(--s3);
  color:var(--text); text-decoration:none;
}
/* 校徽（真图，src/assets/emblem/qingteng-emblem.png）
   原图 961×640，圆徽居中、两侧是透明留白：用 1:1 裁切盒 + object-fit:cover 去掉透明边，
   等比不拉伸（cover 只裁掉透明部分，不改变比例）。 */
.brand__mark{
  flex:0 0 auto; display:block;
  width:48px; height:48px;
  object-fit:cover;
}
/* 深色底上深酒红校徽只有 1.74:1，看不清 → 垫一层"在深色下是浅色"的令牌当底托。
   注意这里**不能用 --seal-soft**：按契约 §五，它在深色下被换成深色变体（那是给文字底用的），
   垫上去等于没垫。校徽是固定色彩的位图（令牌染不动它），所以底托取深色下为浅色的 --ink：
   校徽在它上面 7.8:1。浅色模式下校徽在纸面上本来就有 9.7:1，不需要底。
   底托上不承载任何文字，纯色直角，不引入新色值。 */
@media (prefers-color-scheme: dark){
  .brand__mark{
    background:var(--ink);
    padding:3px; box-sizing:content-box;
  }
}
.brand__text{ display:flex; flex-direction:column; }
.brand__name{
  font-family:var(--font-serif); font-size:1.25rem; font-weight:600; letter-spacing:.14em;
}
.brand__sub{
  font-size:.75rem; letter-spacing:.22em; color:var(--muted);
}

.site-nav{ display:flex; flex-wrap:wrap; gap:var(--s1); }
.site-nav a{
  display:inline-block; padding:var(--s2) var(--s3);
  color:var(--text); text-decoration:none;
  border:1px solid transparent;
}
.site-nav a:hover{ border-color:var(--rule); }
.site-nav a[aria-current="page"]{
  color:var(--text);
  border-color:var(--rule);
  background:var(--paper);
  font-weight:600;
}
.site-nav a[aria-current="page"]::after{
  content:""; display:block; height:2px; margin-top:2px; background:var(--seal);
}

.site-footer{
  border-top:var(--border);
  margin-top:var(--s8);
  padding:var(--s5) 0;
  color:var(--muted); font-size:.875rem;
}
.site-footer__line{ margin:0 0 var(--s1); }
.site-footer__meta a{ color:var(--link); }

main{ display:block; padding-top:var(--s6); min-height:50vh; }

/* ------------------------------------------------------- 通用小部件 —— */

.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s2);
  min-height:40px; padding:var(--s2) var(--s4);
  background:var(--paper); color:var(--text);
  border:1px solid var(--ink); border-radius:var(--radius);
  font-size:.9375rem; text-decoration:none; cursor:pointer;
}
.btn:hover{ background:var(--rule); color:var(--text); }
.btn--primary{ background:var(--fill-invert-bg); color:var(--fill-invert-fg); border-color:var(--ink); }
.btn--primary:hover{ background:var(--fill-invert-bg); color:var(--fill-invert-fg); }
.btn--quiet{ border-color:var(--rule); color:var(--text); }
.btn--quiet:hover{ border-color:var(--ink); background:var(--paper); }
.btn[aria-pressed="true"]{ background:var(--fill-invert-bg); color:var(--fill-invert-fg); border-color:var(--ink); }
.btn[disabled],.btn[aria-disabled="true"]{ color:var(--muted); border-color:var(--rule); cursor:not-allowed; }

.chip{
  display:inline-flex; align-items:center; gap:var(--s1);
  min-height:34px; padding:var(--s1) var(--s3);
  border:1px solid var(--rule); background:var(--paper); color:var(--text);
  text-decoration:none; font-size:.875rem;
}
.chip:hover{ border-color:var(--ink); color:var(--text); }
.chip[aria-current="true"]{ background:var(--fill-invert-bg); color:var(--fill-invert-fg); border-color:var(--ink); }

.badge{
  display:inline-block; padding:1px var(--s2);
  font-size:.75rem; font-weight:700; letter-spacing:.06em; line-height:1.6;
  border-radius:var(--radius);
}
.badge--review{ background:var(--warn); color:var(--paper); }
.badge--seal{ color:var(--seal); border:1px solid var(--seal); background:var(--paper); }
.badge--quiet{ color:var(--muted); border:var(--border); }

.state{ color:var(--muted); padding:var(--s6) 0; }
.state--error{ color:var(--text); }
.state--error code{ font-family:ui-monospace,Consolas,monospace; background:var(--rule); padding:1px 4px; }

.notice,.banner{
  border:var(--border); border-left:3px solid var(--warn);
  background:var(--paper); padding:var(--s4);
  margin:0 0 var(--s5);
}
.notice p:last-child,.banner p:last-child{ margin-bottom:0; }
.banner__title{ font-weight:700; margin-bottom:var(--s2); }

.placeholder{
  color:var(--muted); border:1px dashed var(--rule);
  padding:var(--s2) var(--s3); font-size:.875rem; display:inline-block;
}

.kv{ display:grid; grid-template-columns:max-content 1fr; gap:var(--s2) var(--s4); margin:0 0 var(--s5); }
.kv dt{ color:var(--muted); }
.kv dd{ margin:0; }

/* --------------------------------------------------------- 期号墙 —— */

.page-head{ margin-bottom:var(--s5); }
.page-head h1{ font-size:clamp(1.6rem,3.4vw,2.3rem); margin-bottom:var(--s2); }
.page-head__lead{ color:var(--muted); max-width:62ch; margin-bottom:var(--s4); }

.filters{ border-top:var(--border); border-bottom:var(--border); padding:var(--s3) 0; margin-bottom:var(--s5); }
.filters__row{ display:flex; align-items:baseline; gap:var(--s2); flex-wrap:wrap; margin-bottom:var(--s2); }
.filters__row:last-child{ margin-bottom:0; }
.filters__label{
  font-size:.8125rem; letter-spacing:.16em; color:var(--muted);
  min-width:4.5em; font-family:var(--font-serif);
}
.filters__items{ display:flex; flex-wrap:wrap; gap:var(--s2); }
.filters__count{ color:var(--muted); font-size:.875rem; margin-top:var(--s3); }

.wall{
  display:grid; gap:var(--s5);
  grid-template-columns:repeat(auto-fill,minmax(258px,1fr));
  margin-bottom:var(--s6);
}

.card{
  border:var(--border); background:var(--paper);
  display:flex; flex-direction:column;
}
.card__link{ display:block; color:var(--text); text-decoration:none; }
.card__link:hover .card__title{ text-decoration:underline; }
.card__cover{
  display:block; width:100%;
  aspect-ratio:var(--cover-ratio);
  object-fit:contain;
  background:var(--paper);
  border-bottom:var(--border);
}
.card__cover--empty{
  display:flex; align-items:center; justify-content:center;
  color:var(--muted); font-size:.875rem;
}
.card__body{ padding:var(--s4); display:flex; flex-direction:column; gap:var(--s2); }
.card__numbers{
  display:flex; align-items:baseline; gap:var(--s1);
  font-family:var(--font-serif); font-variant-numeric:tabular-nums;
  letter-spacing:.02em; line-height:1;
}
.card__year{ font-size:clamp(2rem,5vw,2.75rem); font-weight:600; }
.card__slash{ font-size:clamp(1.4rem,3.4vw,1.9rem); color:var(--muted); }
.card__seq{ font-size:clamp(2rem,5vw,2.75rem); font-weight:400; color:var(--vine); }
@media (prefers-color-scheme: dark){ .card__seq{ color:var(--ink); } }
.card__serial{ font-size:.8125rem; color:var(--seal); letter-spacing:.08em; }
.card__title{ font-family:var(--font-serif); font-size:1.125rem; margin:0; }
.card__summary{ color:var(--muted); font-size:.875rem; margin:0; }
.card__meta{ display:flex; flex-wrap:wrap; gap:var(--s1) var(--s3); font-size:.8125rem; color:var(--muted); align-items:center; }
.card__foot{
  margin-top:auto; padding:var(--s3) var(--s4);
  border-top:var(--border); display:flex; gap:var(--s2); flex-wrap:wrap; align-items:center;
}

/* --------------------------------------------------------- 阅读器 —— */

.reader{ display:flex; flex-direction:column; gap:var(--s4); }

.reader__bar{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:var(--s4); flex-wrap:wrap;
  padding-bottom:var(--s3); border-bottom:var(--border);
}
.reader__ident{ display:flex; flex-direction:column; gap:var(--s1); min-width:0; }
.reader__back{ font-size:.875rem; color:var(--muted); text-decoration:none; }
.reader__back:hover{ color:var(--text); text-decoration:underline; }
.reader__title{ font-size:clamp(1.25rem,2.6vw,1.7rem); margin:0; }
.reader__sub{ color:var(--muted); font-size:.875rem; margin:0; }
.reader__tools{ display:flex; gap:var(--s2); flex-wrap:wrap; align-items:center; }

.segmented{ display:inline-flex; border:1px solid var(--ink); border-radius:var(--radius); }
.segmented .btn{ border:0; border-left:1px solid var(--ink); min-height:38px; }
.segmented .btn:first-child{ border-left:0; }
.segmented .btn[aria-pressed="true"]{ background:var(--fill-invert-bg); color:var(--fill-invert-fg); }

.reader__review{
  border:var(--border); border-left:3px solid var(--warn);
  background:var(--seal-soft);   /* 待核/提示行的极浅底：深色下由深色块换成 --seal-soft-dark，
                                    与其上正文 11.53:1、次要文字 5.45:1，浅深两套都安全 */
  padding:var(--s3) var(--s4); font-size:.875rem;
}
.reader__review ul{ margin:var(--s2) 0 0; }
.reader__review a{ color:var(--link); }

/* 册子翻页 */
.stage{
  position:relative;
  border:var(--border);
  background:var(--paper);
  padding:var(--s4);
  min-height:40vh;
}
.stage__viewport{
  position:relative; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  min-height:30vh;
}
.stage__img{
  display:block; margin:0 auto;
  max-width:100%;
  max-height:calc(100vh - 260px);
  width:auto; height:auto;
  object-fit:contain;
  transform-origin:center center;   /* 缩放/位移由 app.js 写 inline transform，此处不重复声明 */
  touch-action:pan-y;
}
.stage[data-zoom="on"] .stage__img{ touch-action:none; cursor:grab; }

.stage__nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:48px; height:96px; min-height:48px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.75rem; line-height:1;
  background:var(--paper); color:var(--text);
  border:var(--border); border-radius:var(--radius); cursor:pointer;
}
.stage__nav:hover{ border-color:var(--ink); }
.stage__nav--prev{ left:var(--s2); }
.stage__nav--next{ right:var(--s2); }
.stage__nav[disabled]{ color:var(--muted); cursor:not-allowed; }

.stage__caption{
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--s2) var(--s3);
  padding-top:var(--s3); margin-top:var(--s3);
  border-top:var(--border); font-size:.875rem; color:var(--muted);
}
.stage__caption .badge{ font-size:.75rem; }
.stage__page{ color:var(--text); font-family:var(--font-serif); }

/* 长图滚动 */
.scroll-list{ display:flex; flex-direction:column; gap:var(--s5); }
.scroll-item{ border:var(--border); background:var(--paper); padding:var(--s4); }
.scroll-item__img{ display:block; width:100%; height:auto; }
.scroll-item__caption{
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--s2) var(--s3);
  padding-top:var(--s3); margin-top:var(--s3); border-top:var(--border);
  font-size:.875rem; color:var(--muted);
}
.scroll-item__caption .spacer{ margin-left:auto; }

/* 阅读器底栏 */
.reader__foot{
  position:sticky; bottom:0; z-index:10;
  display:flex; align-items:center; gap:var(--s2) var(--s4); flex-wrap:wrap;
  padding:var(--s3) 0;
  background:var(--paper);
  border-top:var(--border);
}
.pager{ display:flex; align-items:center; gap:var(--s2); font-size:.9375rem; }
.pager__input{
  width:4.2em; min-height:38px; padding:var(--s1) var(--s2);
  background:var(--paper); color:var(--text);
  border:1px solid var(--ink); border-radius:var(--radius);
  text-align:center; font-variant-numeric:tabular-nums;
}
.reader__foot .spacer{ margin-left:auto; }
.reader__hint{ color:var(--muted); font-size:.8125rem; width:100%; }

/* ------------------------------------------------------- 校园影像 —— */

.campus-year{ margin-bottom:var(--s7); }
.campus-year__head{
  display:flex; align-items:baseline; gap:var(--s3);
  border-bottom:var(--border); padding-bottom:var(--s2); margin-bottom:var(--s4);
}
.campus-year__num{
  font-family:var(--font-serif); font-size:clamp(1.6rem,4vw,2.2rem);
  font-variant-numeric:tabular-nums; line-height:1;
}
.campus-year__note{ color:var(--muted); font-size:.875rem; }
.campus-album{ margin-bottom:var(--s6); }
.campus-album h3{
  font-family:var(--font-serif); font-size:1.0625rem; font-weight:600;
  margin:0 0 var(--s3);
}
/* 深链接 #/campus/<期号> 指向的那一组：用印章色小方块点一下（极小面积） */
.campus-album[data-target] > h3::before{
  content:""; display:inline-block;
  width:9px; height:9px; margin-right:var(--s2);
  background:var(--seal); vertical-align:baseline;
}
.campus-grid{
  display:grid; gap:var(--s4);
  grid-template-columns:repeat(auto-fill,minmax(168px,1fr));
}
.shot{ border:var(--border); background:var(--paper); display:flex; flex-direction:column; }
.shot__btn{
  padding:0; border:0; background:var(--paper); cursor:zoom-in;
  display:block; width:100%; border-bottom:var(--border);
}
.shot__img{ display:block; width:100%; height:auto; }
.shot__foot{
  padding:var(--s2) var(--s3); display:flex; flex-wrap:wrap; gap:var(--s2);
  align-items:center; font-size:.8125rem; color:var(--muted);
}
.shot__foot .badge{ font-size:.7rem; }

/* --------------------------------------------------------- 关于 —— */

.about{ max-width:74ch; }
.about section{ margin-bottom:var(--s6); }
.about h2{ font-size:1.25rem; padding-bottom:var(--s2); border-bottom:var(--border); }
.about .kv dt{ min-width:5em; }

/* ------------------------------------------------------- 灯箱 —— */

.lightbox{
  position:fixed; inset:0; z-index:50;
  background:var(--paper);
  display:flex; flex-direction:column;
}
.lightbox__bar{
  display:flex; align-items:center; justify-content:space-between; gap:var(--s3);
  flex-wrap:wrap; padding:var(--s3) var(--s4); border-bottom:var(--border);
}
.lightbox__caption{ margin:0; font-family:var(--font-serif); }
.lightbox__actions{ display:flex; gap:var(--s2); }
.lightbox__stage{
  flex:1; min-height:0; position:relative;
  display:flex; align-items:center; justify-content:center;
  padding:var(--s4); gap:var(--s2);
}
.lightbox__figure{ margin:0; display:flex; align-items:center; justify-content:center; min-width:0; }
.lightbox__figure img{
  max-width:100%; max-height:calc(100vh - 160px); width:auto; height:auto;
  object-fit:contain; border:var(--border);
}
.lightbox__nav{
  width:44px; height:88px; flex:0 0 auto; cursor:pointer;
  background:var(--paper); color:var(--text);
  border:var(--border); border-radius:var(--radius);
  font-size:1.75rem; line-height:1;
}
.lightbox__nav:hover{ border-color:var(--ink); }
.lightbox__nav[disabled]{ color:var(--muted); cursor:not-allowed; }

/* --------------------------------------------------- 打印区（默认藏）—— */

.print-area{ display:none; }
.print-area__img{ display:block; width:100%; height:auto; }
.print-area__caption{ font-size:11pt; color:var(--muted); margin-top:4mm; }

/* --------------------------------------------------------- 打印 —— */

@media print{
  /* 打印固定回落到契约 §五 的浅色令牌值（深色模式打印会白耗墨）。
     这里写的是契约里已有的字面值，不算自创色值；其余一律走变量。
     深色块覆盖过的色令牌必须逐个回退——少一个就会"浅底浅字"：
     --paper/--text/--muted/--rule/--ink（--ink 在深色下是浅灰绿，漏了它，
     编号大字、反白按钮、卡片描边在纸上都印不出来），
     --seal 与 --seal-soft（深色下分别被换成各自的深色变体，回退后纸上才是校徽酒红与极浅底）；
     两个深色变体本身也一并指回浅色值 —— 纸上没有"深色纸面"这回事，
     这样即使将来有规则直接引用 --seal-dark / --seal-soft-dark，打印时也不会出深底。
     --link/--focus/--fill-invert-bg/--fill-invert-fg 是 var(--ink)/var(--paper)
     的别名、使用时才解析，因此被这几行连带修正，无需另写。
     注：本文件注释里不写任何十六进制字面值——契约 §五 的字面色值审计会连注释一起 grep，
     把旧值写进注释会让"旧值是否清除"这类检查出现假阳性。 */
  :root{
    --ink:#1F3A32; --paper:#FBFAF7; --text:#23262B; --muted:#6B7078; --rule:#E3E1DA;
    --seal:#7E1C1D; --seal-soft:#F2E4E4;
    --seal-dark:#7E1C1D; --seal-soft-dark:#F2E4E4;
  }
  body{ background:var(--paper); color:var(--text); }
  /* 纸上不该出现"点了没反应"的东西：导航、页头尾、灯箱、阅读器工具条，
     以及期号墙的筛选按钮行与卡片动作按钮。信息性的"共 N 期 · M 页"保留。 */
  .site-header,.site-footer,.skip-link,.banner,.notice,.lightbox,
  .reader__bar,.reader__foot,.stage__nav,.site-nav,
  .filters__row,.card__foot,.no-print{ display:none !important; }

  body[data-printing="page"] #main{ display:none !important; }
  body[data-printing="page"] .print-area{ display:block !important; }

  .wall{ grid-template-columns:repeat(2,1fr); }
  .card{ break-inside:avoid; }
  a[href^="#"]{ text-decoration:none; color:var(--text); }
  a[href^="http"]::after{ content:" (" attr(href) ")"; font-size:9pt; }
}

/* --------------------------------------------------------- 手机 —— */

@media (max-width:720px){
  body{ font-size:15px; }
  .wrap{ padding:0 var(--s3); }
  main{ padding-top:var(--s5); }

  .site-header__inner{ padding-top:var(--s3); padding-bottom:var(--s3); }
  .brand__mark{ width:40px; height:40px; }
  .brand__sub{ display:none; }

  .wall{ grid-template-columns:1fr 1fr; gap:var(--s3); }
  .card__body{ padding:var(--s3); gap:var(--s1); }
  .card__foot{ padding:var(--s2) var(--s3); }
  .card__summary{ display:none; }

  .stage{ padding:0; }
  .stage__img{ max-height:calc(100vh - 300px); }
  .stage__nav{ width:40px; height:72px; }
  .stage__nav--prev{ left:0; }
  .stage__nav--next{ right:0; }

  .reader__foot{ gap:var(--s2); }
  .pager__input{ width:3.6em; }
  .reader__tools{ width:100%; }
  .reader__tools .btn{ flex:1 1 auto; }

  .campus-grid{ grid-template-columns:1fr 1fr; gap:var(--s3); }
  .filters__label{ min-width:auto; }
  .lightbox__nav{ width:36px; height:64px; }
}

@media (max-width:420px){
  .wall{ grid-template-columns:1fr; }
}

/* --------------------------------------------- 尊重减弱动效偏好 —— */

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}