/* =========================================================
   墨函 · 水墨宣纸山水
   零外网依赖：字体全部走系统中文字体回退，纹理由 CSS + 内联 SVG 生成
   ========================================================= */

:root{
  --paper:      #efe8d8;
  --paper-lite: #f7f2e6;
  --paper-deep: #e4dbc7;
  --ink:        #1d1c19;
  --ink-2:      #3a3833;
  --ink-3:      #6a6355;
  --ink-4:      #8d8776;
  --seal:       #9c2a22;
  --seal-lite:  #b64a3f;
  --gold:       #a8894f;
  --rule:       rgba(70, 62, 46, .18);
  --rule-soft:  rgba(70, 62, 46, .10);

  --serif: "Songti SC", "STSong", "SimSun", "Songti TC", "Noto Serif CJK SC", "Source Han Serif SC", serif;
  --kai:   "STKaiti", "KaiTi", "Kaiti SC", "Kaiti TC", "Songti SC", "STSong", serif;

  --shadow-s: 0 2px 8px rgba(60,50,30,.10);
  --shadow-m: 0 12px 34px rgba(60,50,30,.14);
  --shadow-l: 0 26px 70px rgba(50,42,26,.20);
}

*{ box-sizing: border-box; }

/* hidden 属性必须压过组件自身的 display */
[hidden]{ display:none !important; }

html,body{ height:100%; }

body{
  margin:0;
  min-height:100dvh;
  font-family: var(--serif);
  color: var(--ink);
  background:
    radial-gradient(120% 90% at 22% 8%, #fbf7ec 0%, rgba(251,247,236,0) 55%),
    radial-gradient(100% 80% at 82% 92%, #ece2cd 0%, rgba(236,226,205,0) 60%),
    linear-gradient(180deg, #f4eee0 0%, var(--paper) 42%, #e9e0cd 100%);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

/* ---------- 宣纸纹理 / 山水场景 ---------- */
.scene{ position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }

/* 纸纤维：内联 SVG 湍流噪点 */
.grain{
  position:absolute; inset:0;
  opacity:.26;
  mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='f'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='300' height='300' filter='url(%23f)' opacity='0.34'/></svg>");
  background-size:300px 300px;
}
/* 宣纸横帘纹 */
.scene:after{
  content:""; position:absolute; inset:0;
  opacity:.13;
  background-image:repeating-linear-gradient(0deg, rgba(120,105,80,.16) 0 1px, transparent 1px 4px);
  mix-blend-mode:multiply;
}

.mountains{
  position:absolute; left:0; bottom:0;
  width:100%;
  height:100%;
  animation: drift 100s ease-in-out infinite alternate;
}
@keyframes drift{
  0%   { transform: translateX(0) scale(1); }
  100% { transform: translateX(-1.4%) scale(1.02); }
}

.mist{
  position:absolute; height:42%; width:140%; left:-20%;
  background:radial-gradient(ellipse at center, rgba(255,255,255,.72) 0%, rgba(255,255,255,0) 68%);
  filter:blur(6px);
}
.mist-a{ bottom:16%; animation: mist 46s ease-in-out infinite alternate; }
.mist-b{ bottom:2%;  opacity:.7; animation: mist 62s ease-in-out infinite alternate-reverse; }
@keyframes mist{
  0%   { transform: translateX(-4%) translateY(0); }
  100% { transform: translateX(6%) translateY(-2.4%); }
}

.vignette{
  position:absolute; inset:0;
  background:
    radial-gradient(120% 100% at 50% 45%, rgba(255,255,255,0) 52%, rgba(120,104,76,.16) 100%),
    linear-gradient(180deg, rgba(255,253,246,.5) 0%, rgba(255,253,246,0) 30%);
}

/* ---------- 通用控件 ---------- */
button, input, select{ font-family: inherit; color: inherit; }
button{ cursor:pointer; }

.ghost{
  background:transparent;
  border:1px solid var(--rule);
  color: var(--ink-2);
  padding:7px 14px;
  font-size:13px;
  letter-spacing:.18em;
  border-radius:2px;
  transition: all .28s cubic-bezier(.3,.7,.4,1);
  position:relative;
  overflow:hidden;
}
.ghost:hover{ color:var(--paper-lite); background:var(--ink-2); border-color:var(--ink-2); }
.ghost.tiny{ padding:5px 10px; font-size:12px; letter-spacing:.12em; }
.ghost.danger:hover{ background:var(--seal); border-color:var(--seal); }
.ghost.inline{ display:inline-block; text-decoration:none; }

.seal-mini{
  width:34px; height:34px; padding:0;
  border-radius:3px; border:1px solid rgba(156,42,34,.55);
  color:var(--seal); font-family:var(--kai); font-size:16px;
}
.seal-mini:hover{ background:var(--seal); border-color:var(--seal); color:#fdf8ee; }

.link{
  background:none; border:none; padding:4px 2px;
  color:var(--ink-3); font-size:12.5px; letter-spacing:.14em;
  border-bottom:1px solid transparent; transition:.25s;
}
.link:hover{ color:var(--seal); border-bottom-color:rgba(156,42,34,.4); }

.field{ display:flex; flex-direction:column; gap:7px; margin-bottom:14px; }
.field > span{
  font-size:12px; letter-spacing:.3em; color:var(--ink-3);
}
.field input, .select-mini, .search{
  width:100%;
  padding:10px 12px;
  font-size:14.5px;
  background:rgba(255,253,246,.6);
  border:1px solid var(--rule);
  border-radius:2px;
  outline:none;
  transition:.25s;
  letter-spacing:.04em;
}
.field input:focus, .select-mini:focus, .search:focus{
  border-color:rgba(29,28,25,.45);
  background:#fffdf7;
  box-shadow:0 0 0 3px rgba(29,28,25,.05);
}
.field input::placeholder, .search::placeholder{ color:var(--ink-4); letter-spacing:.2em; }

.ink-btn{
  width:64px; height:64px; margin:6px auto 0;
  display:block; position:relative;
  background:radial-gradient(circle at 35% 30%, #3a3833, var(--ink) 70%);
  color:var(--paper-lite); border:none; border-radius:50%;
  font-family:var(--kai); font-size:22px; letter-spacing:.1em;
  box-shadow:var(--shadow-m), inset 0 0 22px rgba(255,255,255,.08);
  transition: transform .3s cubic-bezier(.2,.8,.3,1.2), box-shadow .3s;
}
.ink-btn em{ font-style:normal; }
.ink-btn:hover{ transform:scale(1.06) rotate(-2deg); box-shadow:var(--shadow-l); }
.ink-btn:active{ transform:scale(.96); }
.ink-btn:disabled{ opacity:.5; cursor:default; transform:none; }
.ink-btn:before{
  content:""; position:absolute; inset:-8px; border-radius:50%;
  border:1px solid rgba(29,28,25,.16);
}

.ink-mini{
  background:var(--ink); color:var(--paper-lite); border:none;
  padding:8px 16px; font-size:12.5px; letter-spacing:.22em;
  border-radius:2px; transition:.28s; position:relative;
}
.ink-mini:hover{ background:var(--seal); }
.ink-mini:disabled{ opacity:.45; cursor:default; }

/* ---------- 登录 ---------- */
.login-wrap{
  position:relative; z-index:2;
  min-height:100dvh;
  display:grid; place-items:center;
  padding:6vh 20px;
}

.scroll-card{
  position:relative;
  width:min(560px, 94vw);
  background:
    linear-gradient(180deg, rgba(255,253,247,.94), rgba(250,246,236,.97));
  box-shadow:var(--shadow-l);
  border:1px solid rgba(160,145,112,.45);
  padding:0 0 6px;
  animation: unfold .9s cubic-bezier(.2,.8,.25,1) both;
}
@keyframes unfold{
  from{ opacity:0; transform:translateY(18px) scaleY(.965); }
  to{ opacity:1; transform:none; }
}
/* 装裱内框 */
.scroll-card:before{
  content:""; position:absolute; inset:11px;
  border:1px solid rgba(150,134,100,.42);
  pointer-events:none;
}
/* 绫绢描边 */
.scroll-card:after{
  content:""; position:absolute; inset:15px;
  border:3px double rgba(168,137,79,.22);
  pointer-events:none;
}

.rod{
  display:block; height:14px; position:relative;
  background:linear-gradient(180deg,#4a3d2c,#2e2618 45%,#5b4a33 100%);
  box-shadow:0 3px 12px rgba(30,24,14,.35);
}
.rod:before,.rod:after{
  content:""; position:absolute; top:-4px; width:12px; height:22px;
  background:linear-gradient(180deg,#6b5636,#3a2f1d);
  border-radius:3px;
}
.rod:before{ left:-8px; }
.rod:after{ right:-8px; }
.rod.top{ margin:-14px -12px 0; }

.scroll-body{ padding:44px 48px 40px; }

.brand{ display:flex; align-items:center; justify-content:center; gap:22px; position:relative; }

.brand-vertical{
  writing-mode: vertical-rl;
  font-family: var(--kai);
  font-size: 46px;
  letter-spacing: .24em;
  line-height:1;
  color:var(--ink);
  text-shadow: 0 1px 0 rgba(255,255,255,.6);
}
.brand-vertical.small{ font-size:22px; letter-spacing:.18em; }

/* 印章 */
.seal{
  width:48px; height:48px; flex:0 0 auto;
  background:linear-gradient(155deg, var(--seal-lite), var(--seal) 65%);
  border-radius:4px;
  display:grid; place-items:center;
  transform: rotate(3.5deg);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.35), 0 4px 12px rgba(120,30,24,.3);
  margin-top:34px;
}
.seal i{
  font-style:normal; font-family:var(--kai); color:#fdf6ea;
  font-size:22px; line-height:1; letter-spacing:0;
  transform:rotate(-2deg);
}
.ghost-seal{
  background:transparent; border:1px solid rgba(140,120,90,.4);
  box-shadow:none; transform:rotate(-4deg);
}
.ghost-seal i{ color:rgba(140,120,90,.55); }

.inscription{
  text-align:center; margin:26px 0 30px;
  font-size:14px; line-height:2.05; letter-spacing:.32em;
  color:var(--ink-3);
}
.inscription span{ font-size:11.5px; letter-spacing:.22em; color:var(--ink-4); }

#loginForm{ max-width:320px; margin:0 auto; }
.hint{ min-height:18px; text-align:center; font-size:12.5px; letter-spacing:.16em; color:var(--seal); margin:14px 0 0; }

/* ---------- 工作台 ---------- */
.app{
  position:relative; z-index:2;
  min-height:100dvh;
  display:flex; flex-direction:column;
}
@media (min-width: 821px){
  .app{ height:100dvh; overflow:hidden; }
}

.topbar{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:14px 26px;
  border-bottom:1px solid var(--rule);
  background:linear-gradient(180deg, rgba(255,253,247,.82), rgba(255,253,247,.42));
  backdrop-filter: blur(6px) saturate(1.05);
  position:sticky; top:0; z-index:6;
}
.topbar-brand{ display:flex; align-items:center; gap:16px; }
.topbar-brand .brand-vertical{ font-size:22px; }

.plaque{
  font-family:var(--kai); font-size:15px; letter-spacing:.42em;
  color:var(--ink-2);
  padding:5px 14px 5px 18px;
  border:1px solid var(--rule);
  background:linear-gradient(180deg, rgba(255,255,255,.5), rgba(240,232,214,.4));
  border-radius:2px;
}
.topbar-actions{ display:flex; gap:9px; align-items:center; }

.board{
  flex:1;
  display:grid;
  grid-template-columns: 264px minmax(280px, 380px) 1fr;
  gap:0;
  padding:14px 16px 14px;
  min-height:0;
  margin:10px 16px 4px;
  background:
    linear-gradient(180deg, rgba(253,250,243,.90), rgba(250,246,236,.94));
  border:1px solid rgba(150,134,100,.30);
  box-shadow: 0 18px 50px rgba(60,50,30,.12), inset 0 0 0 1px rgba(255,255,255,.5);
  position:relative;
}
.board:before{
  content:""; position:absolute; inset:7px;
  border:1px solid rgba(150,134,100,.16);
  pointer-events:none;
}

.pane{
  display:flex; flex-direction:column;
  min-height:0;
  padding:0 18px;
  position:relative;
}
.pane + .pane{ border-left:1px solid var(--rule-soft); }

.pane-head{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:6px 0 12px;
  margin-bottom:6px;
  border-bottom:1px solid var(--rule);
  position:relative;
  flex-wrap:nowrap;
}
.pane-head:after{
  content:""; position:absolute; left:0; bottom:-1px; width:44px; height:2px;
  background:linear-gradient(90deg, var(--ink-2), transparent);
}
.pane-head h2{
  margin:0; font-family:var(--kai); font-size:17px; letter-spacing:.24em;
  color:var(--ink); font-weight:400; display:flex; align-items:center; gap:8px;
  white-space:nowrap; flex:0 0 auto;
}
.pane-head-tools{ display:flex; align-items:center; gap:6px; min-width:0; flex-wrap:wrap; justify-content:flex-end; }

.badge{
  font-family:var(--serif); font-size:11px; letter-spacing:0;
  background:var(--seal); color:#fdf6ea;
  border-radius:9px; padding:1px 7px; min-width:18px; text-align:center;
}

.select-mini{ width:auto; padding:5px 8px; font-size:12.5px; max-width:150px; }
.search{ width:130px; padding:6px 10px; font-size:13px; }

.pane-foot{
  padding:10px 0 6px; border-top:1px solid var(--rule-soft); margin-top:6px;
  display:flex; align-items:center; gap:10px;
}
.pane-foot.between{ justify-content:space-between; }
.pager{ font-size:12px; color:var(--ink-4); letter-spacing:.14em; }

/* 别名录 */
.alias-list{ flex:1; overflow-y:auto; overflow-x:hidden; padding-right:4px; }
.alias-item{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:10px 10px; margin-bottom:5px;
  border:1px solid transparent; border-left:2px solid rgba(140,120,90,.28);
  background:linear-gradient(90deg, rgba(255,253,247,.5), rgba(255,253,247,0));
  cursor:pointer;
  transition:.26s;
  position:relative;
}
.alias-item:hover{
  border-color:var(--rule); border-left-color:var(--seal);
  background:linear-gradient(90deg, rgba(255,252,243,.95), rgba(248,242,229,.5));
  box-shadow:var(--shadow-s);
}
.alias-addr{
  display:block;
  font-size:13px; letter-spacing:.02em; color:var(--ink-2);
  word-break:break-all; line-height:1.5;
}
.alias-meta{ display:block; font-size:10.5px; color:var(--ink-4); letter-spacing:.1em; margin-top:3px; }
.alias-del{
  border:none; background:none; color:var(--ink-4); font-size:14px;
  opacity:0; transition:.2s; padding:2px 4px;
}
.alias-item:hover .alias-del{ opacity:1; }
.alias-del:hover{ color:var(--seal); }

/* 邮件列表 */
.mail-list{ flex:1; overflow-y:auto; overflow-x:hidden; padding-right:4px; }
.mail-item{
  display:grid; grid-template-columns:auto 1fr; gap:10px;
  padding:11px 10px 10px;
  border-bottom:1px dashed var(--rule-soft);
  cursor:pointer; transition:.24s; position:relative;
  background:transparent;
}
.mail-item:before{
  content:""; position:absolute; inset:0;
  background:radial-gradient(140% 120% at 0% 50%, rgba(90,80,60,.13), rgba(90,80,60,0) 62%);
  opacity:0; transition:.3s;
}
.mail-item:hover:before{ opacity:1; }
.mail-item.active{ background:rgba(255,252,243,.9); border-bottom-color:transparent; box-shadow:inset 2px 0 0 var(--seal); }
.dot-unread{
  width:7px; height:7px; border-radius:50%; margin-top:7px;
  background:var(--seal); box-shadow:0 0 0 3px rgba(156,42,34,.12);
}
.dot-unread.read{ background:transparent; box-shadow:none; }
.mail-subject{
  font-size:13.5px; color:var(--ink-2); line-height:1.5;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.mail-item.unread .mail-subject{ color:var(--ink); font-weight:600; }
.mail-sub{ display:flex; justify-content:space-between; gap:8px; margin-top:3px; }
.mail-from{ font-size:11.5px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mail-date{ font-size:10.5px; color:var(--ink-4); white-space:nowrap; letter-spacing:.04em; }
.mail-snippet{
  font-size:11.5px; color:var(--ink-4); margin-top:4px; line-height:1.55;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

/* 信笺 */
.letter{
  flex:1; overflow-y:auto;
  padding:22px 24px 40px;
  background:
    repeating-linear-gradient(0deg, transparent 0 33px, rgba(156,42,34,.07) 33px 34px),
    linear-gradient(180deg, rgba(255,253,248,.92), rgba(252,248,239,.86));
  border:1px solid var(--rule-soft);
  border-top:none;
  position:relative;
  min-height:0;
}
.letter-empty{
  height:100%; min-height:260px;
  display:grid; place-content:center; justify-items:center; gap:18px;
  color:var(--ink-4); font-size:13px; letter-spacing:.32em;
}
.letter-head{ margin-bottom:14px; padding-bottom:12px; border-bottom:1px solid var(--rule-soft); }
.letter-subject{
  font-family:var(--kai); font-size:20px; line-height:1.6; letter-spacing:.06em;
  color:var(--ink); margin:0 0 10px;
}
.letter-meta{ font-size:11.5px; color:var(--ink-3); letter-spacing:.06em; line-height:1.85; }
.letter-meta b{ font-weight:400; color:var(--ink-4); letter-spacing:.2em; margin-right:6px; }
.letter-body{
  font-size:14px; line-height:1.95; color:var(--ink-2);
  white-space:pre-wrap; word-break:break-word;
  letter-spacing:.02em;
}
.letter-body a{ color:#2f5d7c; }
.letter-html{
  width:100%; min-height:340px; border:none; background:transparent;
  display:block;
}
.code-chip{
  display:inline-flex; align-items:center; gap:8px;
  margin:10px 8px 0 0;
  padding:4px 10px;
  background:rgba(156,42,34,.07);
  border:1px dashed rgba(156,42,34,.35);
  border-radius:2px;
  font-family:ui-monospace,Consolas,monospace; font-size:13px; letter-spacing:.12em;
  color:var(--seal); cursor:pointer;
}
.code-chip:hover{ background:rgba(156,42,34,.13); }

/* 状态栏 */
.statusbar{
  display:flex; align-items:center; gap:10px;
  padding:7px 26px 9px;
  font-size:11.5px; letter-spacing:.18em; color:var(--ink-4);
  border-top:1px solid var(--rule-soft);
}
.dot{ width:6px; height:6px; border-radius:50%; background:var(--ink-4); transition:.3s; }
.dot.busy{ background:var(--gold); animation: pulse 1s infinite; }
.dot.ok{ background:#4c7a55; }
.dot.bad{ background:var(--seal); }
@keyframes pulse{ 0%,100%{ opacity:.35; } 50%{ opacity:1; } }

/* 设置抽屉 */
.drawer-mask{
  position:fixed; inset:0; z-index:20;
  background:rgba(40,34,22,.28); backdrop-filter:blur(2px);
  animation: fade .3s both;
}
@keyframes fade{ from{ opacity:0 } to{ opacity:1 } }
.drawer{
  position:fixed; top:0; right:0; bottom:0; z-index:21;
  width:min(420px, 92vw);
  background:linear-gradient(180deg, #fbf7ec, #f3ece0);
  border-left:1px solid var(--rule);
  box-shadow:-20px 0 60px rgba(50,42,26,.2);
  display:flex; flex-direction:column;
  animation: slidein .42s cubic-bezier(.2,.8,.25,1) both;
}
@keyframes slidein{ from{ transform:translateX(100%); } to{ transform:none; } }
.drawer-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 22px; border-bottom:1px solid var(--rule-soft);
}
.drawer-head h2{ margin:0; font-family:var(--kai); font-size:18px; letter-spacing:.3em; font-weight:400; }
.drawer-body{ padding:20px 22px 40px; overflow-y:auto; }
.block{ margin-bottom:30px; }
.block h3{
  margin:0 0 10px; font-family:var(--kai); font-size:14px; letter-spacing:.24em;
  font-weight:400; color:var(--ink-2);
  padding-bottom:7px; border-bottom:1px solid var(--rule-soft);
}
.muted{ font-size:11.5px; color:var(--ink-4); line-height:1.85; letter-spacing:.05em; margin:0 0 12px; }
.muted code{ font-family:ui-monospace,Consolas,monospace; background:rgba(140,120,90,.12); padding:1px 5px; border-radius:2px; }
.stack{ display:flex; flex-direction:column; }
.row2{ display:flex; gap:10px; }
.row2 .narrow{ width:100px; flex:0 0 100px; }
.account-list{ margin-bottom:16px; }
.diag-out{
  margin:10px 0 0; padding:9px 10px;
  font-size:11px; line-height:1.75; color:var(--ink-3);
  background:rgba(140,120,90,.08);
  border:1px solid var(--rule-soft);
  white-space:pre-wrap; word-break:break-all;
  max-height:200px; overflow:auto;
}
.account-row{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:9px 10px; border:1px solid var(--rule-soft); margin-bottom:6px;
  background:rgba(255,253,247,.6); font-size:12.5px;
}
.account-row .who{ color:var(--ink-2); overflow:hidden; text-overflow:ellipsis; }
.account-row .who small{ display:block; color:var(--ink-4); font-size:10.5px; letter-spacing:.06em; }
.account-row .acts{ display:flex; gap:4px; flex:0 0 auto; }

/* Toast */
.toast{
  position:fixed; left:50%; bottom:38px; transform:translateX(-50%);
  z-index:40; padding:11px 22px;
  background:rgba(29,28,25,.93); color:var(--paper-lite);
  font-size:12.5px; letter-spacing:.2em; border-radius:2px;
  box-shadow:var(--shadow-m);
  animation: toastin .35s cubic-bezier(.2,.8,.25,1) both;
}
@keyframes toastin{ from{ opacity:0; transform:translate(-50%, 12px); } to{ opacity:1; transform:translate(-50%,0); } }

/* 滚动条 */
*::-webkit-scrollbar{ width:7px; height:7px; }
*::-webkit-scrollbar-thumb{ background:rgba(120,104,76,.28); border-radius:4px; }
*::-webkit-scrollbar-thumb:hover{ background:rgba(120,104,76,.45); }
*::-webkit-scrollbar-track{ background:transparent; }

/* ---------- 响应式 ---------- */
@media (max-width: 1080px){
  .board{ grid-template-columns: 220px minmax(240px, 320px) 1fr; padding:14px 14px 8px; }
  .pane{ padding:0 12px; }
  .search{ width:104px; }
}

@media (max-width: 820px){
  .board{
    grid-template-columns: 1fr;
    grid-template-rows: auto auto 1fr;
    padding:10px 10px 6px;
    gap:10px;
  }
  .pane{ padding:0 6px; }
  .pane + .pane{ border-left:none; border-top:1px solid var(--rule-soft); padding-top:10px; }
  .pane-alias .alias-list{ max-height:140px; }
  .pane-inbox .mail-list{ max-height:44vh; }
  .board.show-letter .pane-alias,
  .board.show-letter .pane-inbox{ display:none; }
  .board:not(.show-letter) .pane-letter{ display:none; }
  .topbar{ padding:10px 12px; }
  .topbar-brand{ gap:10px; }
  .plaque{ display:none; }
  .scroll-body{ padding:34px 26px 30px; }
  .brand-vertical{ font-size:36px; }
  .letter{ padding:16px 14px 30px; }
  .letter-subject{ font-size:17px; }
}

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