/* ADAM redesign: workspace shell + knowledge tree (#tree).
   Everything is scoped under .shell so index.html is unaffected. */

/* ---------- group hues (the four boughs of the tree) ---------- */
@property --grp{syntax:"<color>";inherits:true;initial-value:#1e7b5e}
.shell{
  --g-code:#2f6cc4;      /* glacier blue, deepened for contrast */
  --g-quant:#1e7b5e;     /* garden green */
  --g-language:#8b4fc0;  /* plum */
  --g-science:#bf6a17;   /* apricot, deepened */
  --glass:color-mix(in srgb,var(--surface) 80%,transparent);
  --glass-strong:color-mix(in srgb,var(--surface) 90%,transparent);
  --hair:color-mix(in srgb,var(--line) 85%,transparent);
}
:root[data-mode=dark] .shell{
  --g-code:#8db4ff;
  --g-quant:#6fcf9f;
  --g-language:#c9a3f4;
  --g-science:#f0a04b;
  --glass:color-mix(in srgb,var(--surface) 76%,transparent);
  --glass-strong:color-mix(in srgb,var(--surface) 88%,transparent);
}

/* ---------- shell frame ---------- */
.shell{background:transparent;font-family:var(--font-body);color:var(--ink)}
.shell .main-wrap{background:transparent;display:flex;flex-direction:column;min-height:100vh}
.shell main{background:transparent;flex:1;width:100%;padding:var(--sp-6) clamp(20px,3.2vw,48px) var(--sp-7)}

/* ---------- sidebar ---------- */
.shell .sidebar{width:252px;padding:28px 18px 22px;background:var(--glass);
  -webkit-backdrop-filter:blur(14px) saturate(1.1);backdrop-filter:blur(14px) saturate(1.1);
  border-right:1px solid var(--hair);border-radius:0;z-index:3}
.shell .brand{font-family:var(--font-display);font-size:24px;font-weight:700;letter-spacing:-.01em;gap:10px;color:var(--ink);padding:2px 6px;border-radius:var(--r-sm)}
.shell .brand-mark{width:34px;height:34px;font-family:var(--font-display);font-style:normal;font-weight:700;font-size:22px;
  color:var(--surface);background:var(--brand);border-radius:60% 4px 60% 4px;padding-bottom:3px}
:root[data-mode=dark] .shell .brand-mark{color:var(--paper)}
.shell .beta{font-family:var(--font-body);font-size:11px;font-weight:600;letter-spacing:0;text-transform:none;
  background:color-mix(in srgb,var(--apricot) 22%,transparent);color:color-mix(in srgb,var(--apricot) 55%,var(--ink));
  padding:1px 7px;border-radius:var(--r-pill);align-self:flex-start;margin-top:2px}
.shell .workspace-label{font-size:var(--fs-xs);letter-spacing:0;text-transform:none;font-weight:500;color:var(--muted);margin:36px 8px 10px}
.shell nav{display:grid;gap:2px}
.shell nav a{position:relative;display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--r-sm);
  color:var(--muted);font-size:var(--fs-sm);font-weight:500;line-height:1.3;transition:background .18s,color .18s}
.shell nav a span{font-size:17px;width:22px;flex:none;text-align:center;opacity:.8}
.shell nav a:hover{color:var(--ink);background:color-mix(in srgb,var(--ink) 5%,transparent)}
.shell .sidebar nav a.active{color:var(--ink);font-weight:600;background:color-mix(in srgb,var(--brand) 13%,transparent)}
.shell .sidebar nav a.active span{color:var(--brand);opacity:1}
.shell .sidebar nav a.active::before{content:"";position:absolute;left:-18px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--brand)}
.shell nav a:focus-visible{outline:2px solid var(--brand);outline-offset:1px}

.shell .side-note{margin-top:auto;padding:16px 16px 16px 18px;border:0;border-radius:var(--r-md);
  background:linear-gradient(160deg,color-mix(in srgb,var(--hero-a) 80%,transparent),color-mix(in srgb,var(--hero-b) 70%,transparent))}
.shell .side-note .seed{display:block;font-size:22px;line-height:1;color:var(--brand);margin-bottom:8px}
.shell .side-note strong{font-family:var(--font-display);font-size:var(--fs-sm);font-weight:600;color:var(--ink)}
.shell .side-note p{font-size:var(--fs-xs);line-height:1.5;margin-top:4px;color:var(--muted)}
.shell .local-note{margin-top:16px;padding:0 8px;font-size:12px;font-weight:500;color:var(--muted);background:none}
.shell .local-note i{background:var(--apricot);width:7px;height:7px}
.shell .local-note p{font-size:12px;line-height:1.45;margin:3px 0 0 13px;opacity:.85}

/* ---------- header / breadcrumb ---------- */
.shell header{position:sticky;top:0;z-index:4;height:68px;padding:0 clamp(20px,3.2vw,48px);font-size:var(--fs-sm);
  background:color-mix(in srgb,var(--paper) 72%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--hair)}
.shell header .crumb{color:var(--muted)}
.shell header .slash{margin:0 10px;color:color-mix(in srgb,var(--muted) 50%,transparent)}
.shell #page-label{font-family:var(--font-display);font-weight:600;color:var(--ink)}
.shell .profile{gap:10px}
.shell .avatar,.shell .profile-avatar{background:var(--brand);color:var(--surface);font-family:var(--font-display);font-weight:600}
:root[data-mode=dark] .shell .profile-avatar{color:var(--paper)}
.shell .profile select{font-size:var(--fs-xs);color:var(--muted)}
.shell .profile-name{font-size:var(--fs-sm);font-weight:500}
.shell .global-controls select,.shell .icon-button{border-radius:var(--r-sm);background:var(--glass-strong);border-color:var(--line);color:var(--ink)}
.shell .global-controls select{font-size:12px;padding:7px 8px}
.shell .dropdown{border-radius:var(--r-md);background:var(--surface);box-shadow:0 18px 50px -12px color-mix(in srgb,var(--ink) 30%,transparent)}
.shell .dropdown a,.shell .dropdown button{font-size:var(--fs-sm)}
.shell .shell-notice{margin:var(--sp-4) clamp(20px,3.2vw,48px) 0;padding:10px 14px;font-size:var(--fs-xs);border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--apricot) 10%,var(--glass));border:1px solid color-mix(in srgb,var(--apricot) 28%,transparent);color:var(--muted)}
.shell footer{display:flex;gap:var(--sp-4);justify-content:space-between;padding:20px clamp(20px,3.2vw,48px);font-size:var(--fs-xs);color:var(--muted);border-top:1px solid var(--hair)}
.shell footer b{font-family:var(--font-display);font-weight:700;color:var(--ink);margin-right:6px}

/* ========== knowledge tree (#tree) ========== */
.shell #app:has(.tree-layout) .heading{margin-bottom:var(--sp-5);align-items:flex-end}
.shell #app:has(.tree-layout) .heading .eyebrow{font-size:var(--fs-sm);font-weight:500;letter-spacing:0;text-transform:lowercase;color:var(--brand);margin-bottom:6px}
.shell #app:has(.tree-layout) .heading .eyebrow::first-letter{text-transform:uppercase}
.shell #app:has(.tree-layout) .heading h1{font-family:var(--font-display);font-size:clamp(2rem,3.6vw,2.75rem);font-weight:700;letter-spacing:-.03em;line-height:1.05}
.shell #app:has(.tree-layout) .heading p{font-size:var(--fs-md);max-width:56ch;margin-top:10px;color:var(--muted)}
.shell #app:has(.tree-layout) .heading .badge{font-size:var(--fs-xs);background:var(--glass);border-color:var(--line);color:var(--muted);padding:6px 12px}
.shell #app:has(.tree-layout) .heading .badge.dot::before{background:var(--apricot)}

/* stats: one quiet ledger strip, not four identical cards */
.shell #app .stats{gap:0;margin-bottom:var(--sp-5);padding:4px;background:var(--glass);border:1px solid var(--hair);border-radius:var(--r-md);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.shell #app .stats .stat{background:transparent;border:0;border-radius:0;padding:12px 18px;gap:12px}
.shell #app .stats .stat+.stat{border-left:1px solid var(--hair)}
.shell #app .stats .stat-icon{display:grid;width:32px;height:32px;font-size:17px;border-radius:50%;background:color-mix(in srgb,var(--sc) 14%,transparent);color:var(--sc)}
.shell #app .stats .stat:nth-child(1){--sc:var(--g-quant)}
.shell #app .stats .stat:nth-child(2){--sc:var(--g-code)}
.shell #app .stats .stat:nth-child(3){--sc:var(--g-science)}
.shell #app .stats .stat:nth-child(4){--sc:var(--g-language)}
.shell #app .stats .stat strong{font-family:var(--font-display);font-size:var(--fs-xl);font-weight:600;letter-spacing:-.02em;line-height:1.1;color:var(--ink)}
.shell #app .stats .stat small{font-size:var(--fs-xs);line-height:1.3;color:var(--muted);display:block}

/* selected group drives one animatable colour for the whole tree area */
.shell .tree-layout{--grp:var(--g-quant);transition:--grp .55s var(--ease-out);grid-template-columns:minmax(0,1fr) 320px;gap:var(--sp-4);align-items:start}
.shell .tree-layout:has([data-group=code].selected){--grp:var(--g-code)}
.shell .tree-layout:has([data-group=language].selected){--grp:var(--g-language)}
.shell .tree-layout:has([data-group=science].selected){--grp:var(--g-science)}

.shell .garden{border-radius:var(--r-lg);border:1px solid var(--hair);padding:20px 22px 18px;min-height:0;
  background:
    radial-gradient(60% 45% at 42% 100%,color-mix(in srgb,var(--grp) 16%,transparent),transparent 70%),
    radial-gradient(70% 60% at 50% 30%,color-mix(in srgb,var(--hero-a) 55%,transparent),transparent 75%),
    var(--glass);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.shell .garden-head{font-size:var(--fs-xs);color:var(--muted)}
.shell .garden-head strong{font-family:var(--font-display);font-size:var(--fs-md);font-weight:600;color:var(--ink);display:flex;align-items:center}
.shell .live-dot{width:8px;height:8px;margin-right:8px;background:var(--grp);box-shadow:0 0 0 4px color-mix(in srgb,var(--grp) 18%,transparent)}
.shell .garden-tip{font-size:var(--fs-xs);color:var(--muted);margin-top:4px}

/* SVG: recolour the drawn boughs; path order = trunk(quant), code, language, science, roots, twigs */
.shell .tree-scene{height:440px}
.shell .tree-lines>g:first-of-type>path{transition:stroke .4s,stroke-width .4s,opacity .4s}
.shell .tree-lines>g:first-of-type>path:nth-child(1){stroke:color-mix(in srgb,var(--g-quant) 45%,var(--muted));stroke-width:11}
.shell .tree-lines>g:first-of-type>path:nth-child(2){stroke:color-mix(in srgb,var(--g-code) 40%,var(--line))}
.shell .tree-lines>g:first-of-type>path:nth-child(3){stroke:color-mix(in srgb,var(--g-language) 40%,var(--line))}
.shell .tree-lines>g:first-of-type>path:nth-child(4){stroke:color-mix(in srgb,var(--g-science) 40%,var(--line))}
.shell .tree-lines>g:first-of-type>path:nth-child(5){stroke:color-mix(in srgb,var(--muted) 55%,transparent)}
.shell .tree-lines>g:first-of-type>path:nth-child(6){stroke:color-mix(in srgb,var(--g-quant) 30%,var(--line))}
.shell .tree-lines .leaf-dot{fill:var(--grp);opacity:.32;transition:opacity .4s}
html[data-mode=dark] .shell .tree-lines{opacity:1}

/* the selected bough regrows from the trunk, full colour */
@keyframes adam-grow{from{stroke-dashoffset:900}to{stroke-dashoffset:0}}
.shell .tree-scene:has([data-group=code].selected) .tree-lines>g:first-of-type>path:nth-child(2),
.shell .tree-scene:has([data-group=language].selected) .tree-lines>g:first-of-type>path:nth-child(3),
.shell .tree-scene:has([data-group=science].selected) .tree-lines>g:first-of-type>path:nth-child(4){
  stroke:var(--grp);stroke-width:7;stroke-dasharray:900;animation:adam-grow .75s var(--ease-out) both}
.shell .tree-scene:has([data-group=quant].selected) .tree-lines>g:first-of-type>path:nth-child(1){stroke:var(--g-quant);stroke-width:13}
.shell .tree-scene:has([data-group=quant].selected) .tree-lines>g:first-of-type>path:nth-child(6){stroke:color-mix(in srgb,var(--g-quant) 70%,transparent)}

/* nodes */
.shell .branch-node{width:150px;padding:4px;border-radius:var(--r-md);color:var(--ink);font-family:var(--font-body)}
.shell .branch-node[data-group=code]{--node:var(--g-code)}
.shell .branch-node[data-group=quant]{--node:var(--g-quant)}
.shell .branch-node[data-group=language]{--node:var(--g-language)}
.shell .branch-node[data-group=science]{--node:var(--g-science)}
.shell .orb{position:relative;width:64px;height:64px;margin-bottom:10px;font-family:var(--font-display);font-size:24px;font-weight:600;color:var(--node);
  background:color-mix(in srgb,var(--node) 9%,var(--surface));
  border:1.5px solid color-mix(in srgb,var(--node) 55%,transparent);
  box-shadow:0 0 0 6px color-mix(in srgb,var(--node) 7%,transparent);
  transition:transform .35s var(--ease-out),background .25s,color .25s,box-shadow .35s var(--ease-out),border-color .25s}
.shell .branch-node:hover .orb{transform:translateY(-2px);box-shadow:0 0 0 7px color-mix(in srgb,var(--node) 14%,transparent)}
.shell .branch-node.selected .orb{background:var(--node);color:var(--surface);border-color:var(--node);transform:scale(1.08);
  box-shadow:0 0 0 7px color-mix(in srgb,var(--node) 20%,transparent),0 0 0 16px color-mix(in srgb,var(--node) 8%,transparent),
    0 12px 28px -8px color-mix(in srgb,var(--node) 60%,transparent)}
:root[data-mode=dark] .shell .branch-node.selected .orb{color:var(--paper)}
.shell .branch-node strong{display:inline-block;font-family:var(--font-display);font-size:var(--fs-sm);font-weight:600;line-height:1.25;letter-spacing:-.01em;color:var(--ink);
  padding:3px 9px;border-radius:var(--r-sm);background:color-mix(in srgb,var(--surface) 86%,transparent);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.shell .branch-node small{font-size:12px;color:var(--muted);margin-top:2px;text-shadow:0 0 4px var(--surface),0 0 2px var(--surface),0 0 8px var(--surface)}
.shell .branch-node.selected small{color:color-mix(in srgb,var(--node) 70%,var(--ink))}
.shell .branch-node:not(.selected){opacity:.88}
.shell .tree-scene:has(.branch-node:hover) .branch-node:not(:hover):not(.selected){opacity:.7}
.shell .branch-node:focus-visible{outline:2px solid var(--node);outline-offset:4px}
@keyframes adam-ripple{from{box-shadow:0 0 0 0 color-mix(in srgb,var(--node) 45%,transparent)}to{box-shadow:0 0 0 22px transparent}}
.shell .branch-node.selected .orb::after{content:"";position:absolute;inset:-1.5px;border-radius:50%;animation:adam-ripple .8s var(--ease-out) 1}

.shell .root-node small{font-size:var(--fs-xs);letter-spacing:0;text-transform:lowercase;color:var(--muted);margin-top:12px;font-weight:500}
.shell .root-node small::first-letter{text-transform:uppercase}
.shell .root-disc{width:60px;height:60px;font-family:var(--font-display);font-style:normal;font-weight:700;font-size:24px;padding-bottom:3px;
  background:color-mix(in srgb,var(--g-quant) 70%,var(--ink));color:var(--surface);border-radius:50% 50% 50% 50%/60% 60% 40% 40%;
  box-shadow:0 0 0 7px color-mix(in srgb,var(--g-quant) 12%,transparent)}
:root[data-mode=dark] .shell .root-disc{background:color-mix(in srgb,var(--g-quant) 75%,var(--paper));color:var(--paper)}

/* branch panel: takes the colour of the selected bough */
.shell .branch-panel{position:relative;border-radius:var(--r-md);padding:22px 20px 18px;border:1px solid var(--hair);overflow:hidden;
  background:var(--glass-strong);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.shell .branch-panel::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:var(--grp)}
.shell .panel-icon{width:46px;height:46px;border-radius:50% 50% 50% 6px;font-family:var(--font-display);font-weight:600;font-size:21px;margin-bottom:14px;
  background:color-mix(in srgb,var(--grp) 15%,transparent);color:var(--grp)}
.shell .branch-panel h2{font-family:var(--font-display);font-size:var(--fs-lg);font-weight:650;line-height:1.2;color:var(--ink)}
.shell .branch-panel p{font-size:var(--fs-xs);line-height:1.5;margin-top:6px;color:var(--muted)}
.shell .subject-list{gap:2px;margin-top:16px;max-height:420px;padding-right:2px;scrollbar-width:thin}
.shell .subject-row{background:transparent;border:0;border-radius:var(--r-sm);padding:9px 10px;gap:10px;transition:background .18s}
.shell .subject-row:hover,.shell .subject-branch[open]>.subject-row{background:color-mix(in srgb,var(--grp) 10%,transparent)}
.shell .subject-row:focus-visible{outline:2px solid var(--grp);outline-offset:0}
.shell .mini-icon{width:30px;height:30px;flex:none;display:grid;place-items:center;border-radius:50%;font-size:15px;
  color:var(--grp);background:color-mix(in srgb,var(--grp) 11%,transparent)}
.shell .subject-row strong{font-size:var(--fs-sm);font-weight:600;line-height:1.3;color:var(--ink)}
.shell .subject-row small{font-size:12px;color:var(--muted)}
.shell .subject-row .arrow{color:var(--muted);transition:transform .25s var(--ease-out)}
.shell .subject-branch[open]>.subject-row .arrow{transform:rotate(180deg);color:var(--grp)}
.shell .twigs{margin:4px 0 10px 24px;padding:2px 0 4px 16px;border-left:2px solid color-mix(in srgb,var(--grp) 45%,transparent)}
.shell .twigs .text-link{font-size:var(--fs-xs);font-weight:600;color:var(--grp)}
.shell .twigs details{margin-top:8px}
.shell .twigs summary{font-size:var(--fs-xs);font-weight:500;color:var(--ink);border-radius:4px}
.shell .twigs summary::marker{color:var(--grp)}
.shell .twig-leaf{font-size:12.5px;line-height:1.4;color:var(--muted);border-left:1px solid var(--line);margin:6px 0 6px 4px;padding:2px 0 2px 10px;transition:color .15s,border-color .15s}
.shell .twig-leaf:hover{color:var(--ink);border-color:var(--grp)}

/* ---------- responsive ---------- */
@media (max-width:1150px){
  .shell .sidebar{width:216px;padding:24px 14px}
  .shell .sidebar nav a.active::before{left:-14px}
  .shell .tree-layout{grid-template-columns:minmax(0,1fr) 270px}
  .shell .branch-node{width:120px}
  .shell .orb{width:56px;height:56px;font-size:21px}
  .shell #app .stats .stat{padding:10px 12px}
  .shell #app .stats .stat-icon{display:none}
}
@media (max-width:900px){
  .shell .sidebar{width:188px;padding:22px 10px}
  .shell nav a{font-size:13px;padding:8px 9px;gap:6px}
  .shell .sidebar nav a.active::before{left:-10px}
  .shell .tree-layout{grid-template-columns:1fr}
  .shell .branch-panel{display:grid;grid-template-columns:1fr 1.6fr;gap:18px}
  .shell .subject-list{margin:0;max-height:300px}
  .shell #app .stats{grid-template-columns:repeat(2,1fr)}
  .shell #app .stats .stat:nth-child(3){border-left:0}
  .shell #app .stats .stat:nth-child(n+3){border-top:1px solid var(--hair)}
}
@media (max-width:640px){
  html:has(.shell){scroll-padding-top:104px}
  .shell{display:block}
  .shell .sidebar{position:sticky;top:0;width:100%;height:auto;padding:10px 16px 0;border-right:0;border-bottom:1px solid var(--hair);
    background:color-mix(in srgb,var(--surface) 88%,transparent);z-index:6;overflow:visible}
  .shell .brand{font-size:20px}
  .shell .brand-mark{width:28px;height:28px;font-size:18px}
  .shell .beta{display:inline-block}
  .shell .workspace-label,.shell .side-note,.shell .local-note{display:none}
  /* nav: one horizontally scrolling row of pills */
  .shell nav{display:flex;gap:4px;margin:8px -16px 0;padding:0 16px 10px;overflow-x:auto;scrollbar-width:none;
    scroll-snap-type:x proximity;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12px,#000 calc(100% - 20px),transparent);
    mask-image:linear-gradient(90deg,transparent,#000 12px,#000 calc(100% - 20px),transparent)}
  .shell nav::-webkit-scrollbar{display:none}
  .shell nav a{flex:none;white-space:nowrap;font-size:13px;padding:7px 12px 7px 10px;gap:5px;border-radius:var(--r-pill);scroll-snap-align:start}
  .shell nav a span{font-size:14px;width:16px}
  .shell .sidebar nav a.active::before{display:none}
  .shell .sidebar nav a.active{background:var(--brand);color:var(--surface)}
  .shell .sidebar nav a.active span{color:inherit}
  :root[data-mode=dark] .shell .sidebar nav a.active{color:var(--paper)}
  .shell header{position:static;height:56px;padding:0 16px;font-size:var(--fs-xs);background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
  .shell main{padding:var(--sp-5) 16px var(--sp-6)}
  .shell .shell-notice{margin:12px 16px 0}
  .shell footer{display:block;padding:18px 16px}
  .shell footer span{display:block;margin-top:4px}
  .shell #app:has(.tree-layout) .heading h1{font-size:30px}
  .shell #app:has(.tree-layout) .heading p{font-size:var(--fs-sm)}
  .shell #app .stats .stat{padding:10px 12px;gap:10px}
  .shell #app .stats .stat-icon{display:grid;width:28px;height:28px;font-size:15px;flex:none}
  .shell #app .stats .stat strong{font-size:var(--fs-lg)}
  .shell #app .stats .stat small{font-size:12px}
  .shell .garden{padding:14px 12px 12px;border-radius:var(--r-md)}
  .shell .garden-head{flex-wrap:wrap;gap:2px 10px}
  .shell .tree-scene{height:380px}
  .shell .branch-node{width:96px;padding:2px}
  .shell .orb{width:48px;height:48px;font-size:18px;margin-bottom:8px;box-shadow:0 0 0 4px color-mix(in srgb,var(--node) 7%,transparent)}
  .shell .branch-node.selected .orb{box-shadow:0 0 0 5px color-mix(in srgb,var(--node) 20%,transparent),0 0 0 11px color-mix(in srgb,var(--node) 8%,transparent)}
  .shell .branch-node strong{font-size:12px;padding:2px 6px}
  .shell .branch-node small{font-size:11px}
  .shell .root-disc{width:50px;height:50px;font-size:20px}
  .shell .branch-panel{grid-template-columns:1fr;gap:12px;padding:18px 14px 14px}
  .shell .branch-panel>div:first-child{display:flex;gap:12px;align-items:center}
  .shell .panel-icon{margin:0;flex:none;width:40px;height:40px;font-size:18px}
  .shell .subject-list{grid-template-columns:1fr;max-height:none;gap:2px}
}
@media (max-width:380px){
  .shell .branch-node{width:84px}
  .shell .branch-node[data-group=quant]{width:108px}
  .shell .branch-node small{display:none}
  .shell nav a{font-size:12.5px;padding:6px 10px 6px 8px}
}

@media (prefers-reduced-motion:reduce){
  .shell .tree-layout{transition:none}
  .shell .tree-lines>g>path{animation:none!important;stroke-dasharray:none!important}
  .shell .branch-node.selected .orb{transform:none}
  .shell .branch-node.selected .orb::after{animation:none}
}