@property --button-tint{syntax:"<color>";inherits:false;initial-value:transparent}
@layer components{
  .ring{position:relative;isolation:isolate;corner-shape:var(--corner-shape)}
  .ring::after,.ring::before{content:"";position:absolute;inset:0;border:var(--ring-width) solid transparent;
    border-radius:inherit;corner-shape:inherit;pointer-events:none;
    background:var(--ring-fill) border-box;
    mask:linear-gradient(black 0 0) padding-box exclude,linear-gradient(black 0 0) border-box}
  .ring::before{mask:none;border:0;background:var(--ring-glow,none);mix-blend-mode:screen}
  .card{width:280px;height:200px;display:grid;place-content:center;text-align:center;
    --ring-width:var(--card-border);border-radius:var(--card-radius);background:rgba(12,20,14,.72);backdrop-filter:blur(4px);
    --ring-fill:linear-gradient(135deg,var(--frame-green-light),var(--frame-green) 50%,var(--frame-green-light))}
  .card::before{inset:var(--inner-inset);border:1px solid transparent;mix-blend-mode:normal;
    border-radius:calc(var(--card-radius) - var(--inner-inset));
    background:linear-gradient(var(--inner-line) 0 0) border-box;
    mask:linear-gradient(black 0 0) padding-box exclude,linear-gradient(black 0 0) border-box}
  .card h3{font:600 26px Cinzel;color:var(--heading);margin:0 0 8px;letter-spacing:.04em}
  .card p{margin:0;font-size:18px}
  .button{border:0;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-button);
    padding:0 var(--button-pad-x);height:var(--button-height);min-width:var(--button-min-width);
    --ring-width:1.5px;border-radius:8px;cursor:var(--cursor-click);
    font:500 var(--button-font-size) Jost;letter-spacing:.09em;text-transform:uppercase;color:var(--button-text);text-shadow:0 1px 2px black;
    background:
      linear-gradient(var(--button-tint) 0 0),
      radial-gradient(ellipse 50% 45% at 50% 0%,rgba(255,225,160,.30),transparent 70%),
      radial-gradient(ellipse 70% 95% at 50% 0%,rgba(225,110,30,.28),transparent 75%),
      radial-gradient(ellipse 50% 45% at 50% 100%,rgba(255,225,160,.22),transparent 70%),
      radial-gradient(ellipse 70% 95% at 50% 100%,rgba(225,110,30,.22),transparent 75%),
      radial-gradient(ellipse 120% 150% at 50% 50%,transparent 45%,rgba(10,5,2,.55)),
      var(--mottle) center/100% 100% no-repeat;
    box-shadow:inset 0 0 0 3px rgba(0,0,0,.35),0 2px 8px rgba(0,0,0,.6);
    --ring-fill:
      radial-gradient(ellipse 30% 100% at 50% 0%,var(--gold-highlight),transparent),
      radial-gradient(ellipse 30% 100% at 50% 100%,var(--gold-highlight),transparent),
      linear-gradient(90deg,var(--gold-dark),var(--gold) 50%,var(--gold-dark));
    --ring-glow:
      radial-gradient(ellipse 30% 6px at 50% 8px,rgba(255,200,120,.6),transparent),
      radial-gradient(ellipse 40% 12px at 50% 8px,rgba(240,120,40,.35),transparent),
      radial-gradient(ellipse 30% 6px at 50% calc(100% - 8px),rgba(255,215,150,.4),transparent)}
  .button.danger{--button-hover-tint:color-mix(in srgb,var(--art-raid) 50%,transparent);
    --ring-fill:
      radial-gradient(ellipse 30% 100% at 50% 0%,var(--danger-light),transparent),
      radial-gradient(ellipse 30% 100% at 50% 100%,var(--danger-light),transparent),
      linear-gradient(90deg,var(--danger-dark),var(--art-raid) 50%,var(--danger-dark));
    --ring-glow:
      radial-gradient(ellipse 30% 6px at 50% 8px,color-mix(in srgb,var(--danger-light) 55%,transparent),transparent),
      radial-gradient(ellipse 40% 12px at 50% 8px,color-mix(in srgb,var(--art-raid) 35%,transparent),transparent),
      radial-gradient(ellipse 30% 6px at 50% calc(100% - 8px),color-mix(in srgb,var(--danger-light) 40%,transparent),transparent);
    --button-tint:color-mix(in srgb,var(--danger-dark) 42%,transparent)}
  .button::before{inset:-8px 0}
  .button{transition:transform var(--button-ease),--button-tint var(--button-ease),box-shadow var(--button-ease)}
  .button:hover,.button:focus-visible{transform:translateY(var(--button-lift));--button-tint:var(--button-hover-tint);
    box-shadow:inset 0 0 0 3px rgba(0,0,0,.35),inset 0 10px 14px -8px var(--button-hover-glow),inset 0 -10px 14px -8px var(--button-hover-glow),
      0 6px 16px rgba(0,0,0,.6),0 0 22px var(--button-hover-glow)}
  .button:focus-visible{outline:none}
  .button[hidden]{display:none}
  .button:active{transform:translateY(0);--button-tint:transparent;transition-duration:.08s}
  @media (prefers-reduced-motion:reduce){.button:hover,.button:focus-visible{transform:none}.button .arrow{animation:none}}
  .button .arrow{position:absolute;right:var(--button-arrow-right);top:50%;translate:0 -54%;
    font-size:24px;line-height:1;color:var(--gold-light);
    text-shadow:0 0 4px var(--button-arrow-glow),0 0 10px var(--button-arrow-glow),0 0 18px var(--button-arrow-glow);
    transition:translate var(--button-ease);
    animation:arrow-pulse var(--button-arrow-pulse) ease-in-out infinite paused}
  @keyframes arrow-pulse{
    0%,100%{text-shadow:0 0 4px var(--button-arrow-glow-dim),0 0 10px var(--button-arrow-glow-dim),0 0 16px var(--button-arrow-glow-dim)}
    50%    {text-shadow:0 0 6px var(--button-arrow-glow),0 0 18px var(--button-arrow-glow),0 0 34px var(--button-arrow-glow),0 0 50px var(--button-arrow-glow-dim)}}
  .button:nth-child(2) .arrow{animation-delay:calc(var(--button-arrow-pulse) * -.5)}
  .button:hover .arrow,.button:focus-visible .arrow{translate:3px -54%;animation-play-state:running}
  .site-header{position:absolute;z-index:10;top:var(--header-top);left:calc(var(--page-gutter) - var(--space-4));right:calc(var(--page-gutter) - var(--space-4));
    height:var(--header-height);isolation:isolate;
    display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);
    padding:0 var(--header-pad-right) calc(var(--header-height) - var(--header-field-center) * 2) var(--header-pad-left)}
  .site-header::after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;
    background:url("/assets/site/brand/header-bar.webp") 0 0/100% 100% no-repeat;filter:brightness(var(--header-brightness))}
  .site-header .brand{padding-left:calc(var(--header-crest-size) + var(--header-crest-left) - var(--header-pad-left) + var(--space-2))}
  .site-header .brand-crest{position:absolute;z-index:1;top:calc(var(--header-field-center) - var(--header-crest-size) / 2);left:var(--header-crest-left);
    width:var(--header-crest-size);height:var(--header-crest-size);filter:drop-shadow(var(--text-shadow))}
  .site-header .brand-wordmark{height:var(--header-wordmark-height);width:auto;filter:drop-shadow(var(--text-shadow))}
  .brand{display:flex;align-items:center;gap:var(--space-2)}
  .brand img{height:52px;width:auto}
  .brand span{font:600 30px Cinzel;color:var(--heading);letter-spacing:.05em}
  .site-header .login{height:var(--header-login-height);min-width:0;padding:0 var(--space-4);gap:var(--space-2);font-size:var(--header-login-size)}
  .login svg,.discord svg{width:20px;height:20px;flex:none}
  .account{display:flex;align-items:center;gap:var(--space-3)}
  .account-greeting{display:grid;text-align:right;line-height:1.15;text-shadow:0 1px 3px rgba(0,0,0,.8)}
  .account-greeting small{font:400 var(--account-hello-size) Jost;letter-spacing:.06em;color:var(--text-muted)}
  .account-name{max-width:16ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    font:500 var(--account-name-size) Cinzel;letter-spacing:.05em;color:var(--heading)}
  .account-link{flex:none;display:block;line-height:0}
  .account-link .painted{width:var(--account-gear);height:var(--account-gear);
    filter:drop-shadow(0 1px 2px rgba(0,0,0,.8));transition:filter var(--button-ease),rotate .6s ease}
  .account-link:focus-visible{outline:none}
  .account-link:hover .painted,.account-link:focus-visible .painted{filter:brightness(1.18) drop-shadow(0 1px 2px rgba(0,0,0,.8))}
  .account-gear:hover .painted,.account-gear:focus-visible .painted{rotate:60deg}
  .account-link[aria-current] .painted{filter:brightness(1.18) drop-shadow(0 0 8px var(--button-hover-glow))}
  .sticky-bar .account-name{font-size:15px}
  .sticky-bar .account-greeting small{font-size:12px}
  .main-nav{position:absolute;left:50%;top:var(--header-field-center);translate:-50% calc(-50% + var(--nav-optical-y));
    display:flex;align-items:center;gap:var(--nav-gap)}
  .main-nav a{position:relative;z-index:0;white-space:nowrap;font:500 var(--nav-size) Jost;letter-spacing:.12em;text-transform:uppercase;color:var(--nav-text);
    padding:var(--space-1) 0;text-shadow:0 1px 3px rgba(0,0,0,.8);transition:color var(--button-ease)}
  .main-nav a+a::before{content:"";position:absolute;left:calc(var(--nav-gap) / -2);top:50%;
    width:var(--nav-leaf);height:var(--nav-leaf);translate:-50% -50%;pointer-events:none;
    background:var(--old-gold-strong);mask:var(--flat-leaf-crest) center/contain no-repeat}
  .main-nav a::after{content:"";position:absolute;z-index:-1;left:50%;top:50%;pointer-events:none;
    width:var(--nav-glow-size);height:var(--nav-glow-size);translate:-50% -50%;border-radius:50%;
    background:radial-gradient(circle,var(--nav-glow) 0,var(--nav-glow-soft) 50%,transparent 70%);
    opacity:0;scale:.5;transition:opacity var(--button-ease),scale var(--button-ease)}
  .main-nav a[hidden]{display:none}
  .main-nav a:hover,.main-nav a:focus-visible{color:var(--gold-light)}
  .main-nav a:hover::after,.main-nav a:focus-visible::after{opacity:1;scale:1}
  .main-nav a[aria-current]{color:var(--heading);
    background:linear-gradient(90deg,transparent,var(--gold),transparent) center bottom 3px/100% 1px no-repeat,
      radial-gradient(closest-side,rgba(240,170,80,.45),transparent) center bottom 1px/100% 6px no-repeat}
  .panel.float-menu{position:fixed;z-index:30;left:var(--menu-x,0);top:var(--menu-y,0);width:auto;height:auto;min-width:220px;
    padding:var(--space-2);gap:0}
  .float-menu-item{display:grid;grid-template-columns:26px 1fr 18px;align-items:center;gap:var(--space-1);
    width:100%;padding:var(--space-2) var(--space-3);border:0;background:none;text-align:left;cursor:var(--cursor-click);
    font:400 16px Jost;color:var(--text);border-radius:6px}
  .float-menu-item::after{content:"";width:18px;height:18px}
  .float-menu-icon{--painted-size:24px;width:24px;height:24px;opacity:.65;
    transition:opacity var(--button-ease)}
  .float-menu-item.is-set .float-menu-icon,
  .float-menu-item:hover .float-menu-icon,
  .float-menu-item:focus-visible .float-menu-icon{opacity:1}
  .float-menu-item:hover,.float-menu-item:focus-visible{outline:none;background:var(--field-tint);color:var(--gold-light)}
  .float-menu-item:disabled{cursor:var(--cursor);color:var(--heading)}
  .float-menu-item.is-set::after{
    background:linear-gradient(var(--gold-light),var(--gold));
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.6 16.3 4.8 11.5l1.5-1.5 3.3 3.3 8.1-8.1 1.5 1.5z'/%3E%3C/svg%3E") center/contain no-repeat}
  .float-menu-item.is-set{
    background:linear-gradient(90deg,
      color-mix(in srgb,var(--gold) 22%,transparent) 0 3px,
      color-mix(in srgb,var(--gold) 11%,transparent) 3px,
      color-mix(in srgb,var(--gold) 5%,transparent))}
  .float-menu-line{height:var(--border-thin);margin:var(--space-1) var(--space-3);background:var(--rule-gradient)}
  .panel .float-menu-head{margin:var(--space-1) var(--space-3);font:500 12px Jost;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
  @media (pointer:coarse){.float-menu-item{min-height:44px}}
  .nav-toggle{display:none;place-items:center;width:44px;height:44px;flex:none;
    border:0;background:none;padding:0;cursor:var(--cursor-click);color:var(--gold-light)}
  .nav-toggle i{position:relative;width:24px;height:2px;border-radius:1px;background:currentColor;
    box-shadow:0 0 8px var(--button-arrow-glow-dim);transition:background var(--button-ease)}
  .nav-toggle i::before,.nav-toggle i::after{content:"";position:absolute;left:0;width:100%;height:100%;
    border-radius:inherit;background:currentColor;transition:translate var(--button-ease),rotate var(--button-ease)}
  .nav-toggle i::before{top:-7px}
  .nav-toggle i::after{top:7px}
  .site-header.is-open .nav-toggle i{background:transparent;box-shadow:none}
  .site-header.is-open .nav-toggle i::before{translate:0 7px;rotate:45deg}
  .site-header.is-open .nav-toggle i::after{translate:0 -7px;rotate:-45deg}
  @media (prefers-reduced-motion:reduce){.nav-toggle i,.nav-toggle i::before,.nav-toggle i::after{transition:none}}
  @media (max-width:1240px){
    .site-header{position:fixed;top:0;left:0;right:0;height:var(--sticky-height);
      padding:0 var(--page-gutter);gap:var(--space-3);
      background:var(--sticky-bg);-webkit-backdrop-filter:blur(var(--sticky-blur));backdrop-filter:blur(var(--sticky-blur));
      box-shadow:0 14px 28px rgba(0,0,0,.7)}
    .site-header::after{inset:auto 0 0;height:1px;z-index:0;filter:none;
      background:linear-gradient(90deg,transparent,var(--old-gold) 25%,var(--old-gold) 75%,transparent)}
    .site-header .brand{padding-left:0}
    .site-header .brand-crest{position:static;width:40px;height:40px;filter:drop-shadow(var(--text-shadow-soft))}
    .site-header .brand-wordmark{height:22px}
    .site-header .main-nav,.site-header .login,.site-header .account{display:none}
    .nav-toggle{display:grid}
    .site-header.is-open{height:100dvh;flex-wrap:wrap;align-content:start;overflow-y:auto;
      background:var(--sheet-bg);--nav-size:20px}
    .site-header.is-open>.brand,.site-header.is-open>.nav-toggle{height:var(--sticky-height)}
    .site-header.is-open .main-nav{position:static;translate:none;display:grid;justify-items:center;
      flex-basis:100%;gap:var(--space-1);margin-top:var(--space-4);padding-bottom:var(--space-4);
      background:var(--rule-gradient) center bottom/100% var(--border-thin) no-repeat}
    .site-header.is-open .main-nav a+a::before{display:none}
    .site-header.is-open .account{display:grid;justify-items:center;gap:var(--space-3);
      flex-basis:100%;margin-top:var(--space-4)}
    .site-header.is-open .account-greeting{text-align:center;gap:2px}
    .site-header.is-open .account-greeting small{font-size:13px;letter-spacing:.18em;text-transform:uppercase}
    .site-header.is-open .account-name{max-width:none;font-size:28px}
    .site-header.is-open .account-word{position:static;width:auto;height:auto;clip-path:none}
    .site-header.is-open .account-link{display:inline-flex;align-items:center;justify-content:center;
      gap:var(--space-button);width:min(320px,100%);height:var(--button-height);line-height:1;
      border:var(--border-gold) solid var(--gold-dark);border-radius:8px;background:var(--field-tint);
      font:500 var(--button-font-size) Jost;letter-spacing:.09em;text-transform:uppercase;color:var(--text)}
    .site-header.is-open .account-link .painted{width:30px;height:30px}
    .site-header.is-open .login{display:inline-flex;flex-basis:100%;max-width:320px;
      margin:var(--space-4) auto 0;height:var(--button-height);font-size:var(--button-font-size)}
  }
  .sticky-bar{position:fixed;z-index:20;left:0;right:0;max-width:var(--view-width);margin-inline:auto;top:calc(var(--sticky-reach) * -1);
    height:calc(var(--sticky-height) + var(--sticky-reach));padding:var(--sticky-reach) var(--page-gutter) 0;
    display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);
    background:var(--sticky-bg);-webkit-backdrop-filter:blur(var(--sticky-blur));backdrop-filter:blur(var(--sticky-blur));
    box-shadow:0 22px 44px rgba(0,0,0,.85),0 6px 14px rgba(0,0,0,.6);
    translate:0 calc(-100% - 60px);visibility:hidden;
    transition:translate var(--sticky-out),visibility 0s linear .3s}
  .sticky-bar::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;pointer-events:none;
    background:linear-gradient(90deg,transparent,var(--old-gold) 25%,var(--old-gold) 75%,transparent)}
  .sticky-bar.is-shown{translate:none;visibility:visible;transition:translate var(--sticky-in)}
  .sticky-bar>*{opacity:0;transition:opacity .15s ease-out}
  .sticky-bar.is-shown>*{opacity:1;transition:opacity .35s ease-out .15s}
  .sticky-bar .brand img{height:30px}
  .sticky-bar .brand-wordmark{height:24px}
  .sticky-bar .main-nav{top:calc(50% + var(--sticky-reach) / 2);gap:var(--sticky-nav-gap);--nav-gap:var(--sticky-nav-gap)}
  .sticky-bar .main-nav a{font-size:15px}
  .sticky-bar .login{height:40px;min-width:0;padding:0 var(--space-3);gap:var(--space-2);font-size:14px}
  .sticky-bar .login svg{width:18px;height:18px}
  @media (prefers-reduced-motion:reduce){.sticky-bar,.sticky-bar.is-shown,.sticky-bar>*,.sticky-bar.is-shown>*{transition:none}}
  @media (max-width:1240px){.sticky-bar{display:none}}
  .page-head{position:relative;display:flex;flex-direction:column;align-items:center;
    padding:calc(var(--header-top) + var(--header-height) + var(--page-title-gap)) var(--page-gutter) calc(var(--page-content-gap) + var(--page-image-run))}
  .page-head-image,.page-head-shade{position:absolute;top:0;left:var(--page-image-left);
    width:var(--page-image-width);height:var(--page-image-height);pointer-events:none;
    mask:var(--ground-edge) bottom/100% var(--ground-edge-height) no-repeat,
      linear-gradient(black,black) top/100% calc(100% - var(--ground-edge-height)) no-repeat}
  :root{--page-image:var(--page-image-sm)}
  @media (min-width:1240px),(min-width:620px) and (min-resolution:1.5dppx){
    :root{--page-image:var(--page-image-md)}}
  @media (min-width:1700px),(min-width:1240px) and (min-resolution:1.5dppx){
    :root{--page-image:var(--page-image-lg)}}
  .js [data-near]:not(.is-near),.js [data-near]:not(.is-near)::before,.js [data-near]:not(.is-near)::after{
    background-image:none!important}
  .page-head-image{overflow:clip}
  .page-head-image::before{content:"";position:absolute;inset:0;
    background:var(--page-image) center/cover no-repeat}
  .page-head-shade{
    background:
      linear-gradient(var(--vignette),var(--vignette-mid) calc(var(--page-veil-reach,40%) * .45),transparent var(--page-veil-reach,40%)),
      linear-gradient(transparent calc(100% - var(--ground-edge-height) * 1.6),
        color-mix(in srgb,var(--ground) 18%,transparent) calc(100% - var(--ground-edge-height) * .7),
        color-mix(in srgb,var(--ground) 32%,transparent))}
  main.ivy-only{--page-image-run:0px}
  .head-light{position:absolute;left:var(--light-x);top:var(--light-y);translate:-50% -50%;
    width:var(--light-size);pointer-events:none;mix-blend-mode:screen}
  .is-pulse{aspect-ratio:1;
    background:radial-gradient(closest-side,var(--light-core),var(--light-halo) 34%,transparent 68%);
    animation:light-pulse var(--light-time,3.6s) ease-in-out infinite}
  @keyframes light-pulse{
    0%,100%{opacity:.52;scale:.91}
    50%    {opacity:1;scale:1.07}}
  .is-flame{aspect-ratio:.58;transform-origin:50% 78%;
    background:
      radial-gradient(ellipse 30% 42% at 50% 34%,var(--light-core),var(--light-halo) 44%,transparent 76%),
      radial-gradient(ellipse 46% 30% at 50% 66%,var(--light-core),var(--light-halo) 40%,transparent 80%);
    animation:flame-bright var(--flame-bright,2.7s) linear infinite,
              flame-dance var(--flame-dance,1.9s) ease-in-out infinite}
  @keyframes flame-bright{
    0%{opacity:.6}   9%{opacity:1}   15%{opacity:.68} 23%{opacity:.96}
    31%{opacity:.52} 38%{opacity:.86} 47%{opacity:1}  54%{opacity:.64}
    63%{opacity:.93} 71%{opacity:.56} 79%{opacity:1}  88%{opacity:.72}
    100%{opacity:.6}}
  @keyframes flame-dance{
    0%{scale:1 1}      12%{scale:.93 1.12} 27%{scale:1.06 .92}
    39%{scale:.89 1.07} 52%{scale:1.03 1.14} 66%{scale:.95 .94}
    81%{scale:1.07 1.04} 100%{scale:1 1}}
  @media (prefers-reduced-motion:reduce){
    .head-light{animation:none;opacity:.85;scale:1}}
  .page-title{position:relative;z-index:2;
    display:grid;justify-items:center;gap:var(--space-1);text-align:center;
    text-shadow:var(--text-shadow-onimage),var(--text-halo)}
  .page-title h1{font:600 var(--page-title-size)/1.1 Cinzel;letter-spacing:.12em;text-transform:uppercase;
    margin:0 0 -.16em;padding:.05em .06em 0;
    color:transparent;text-shadow:none;
    background:var(--title-metal);-webkit-background-clip:text;background-clip:text;
    filter:drop-shadow(0 0 1px var(--title-rim)) drop-shadow(0 2px 0 var(--title-rim))
      drop-shadow(0 6px 14px rgba(0,0,0,.9)) drop-shadow(0 14px 40px rgba(0,0,0,.75)) var(--title-halo)}
  .page-title .divider{width:var(--page-divider-width);height:auto;
    filter:drop-shadow(0 2px 6px rgba(0,0,0,.9)) drop-shadow(0 6px 20px rgba(0,0,0,.7))}
  .page-title .motto{font:500 15px Jost;letter-spacing:.3em;text-transform:uppercase;color:var(--text);margin:0}
  .lead{max-width:62ch;margin:0 auto var(--space-5);text-align:center;font-size:19px;line-height:1.6;color:var(--text)}
  .text-cloud{position:relative;isolation:isolate}
  .text-cloud::before{content:"";position:absolute;z-index:-1;inset:calc(var(--space-6) * -1.1) calc(var(--space-6) * -2.6);
    backdrop-filter:blur(var(--text-cloud-blur)) brightness(var(--text-cloud-dim));
    background:color-mix(in srgb,var(--text-cloud) 35%,transparent);
    mask:radial-gradient(closest-side,black 0,black 45%,rgba(0,0,0,.7) 65%,rgba(0,0,0,.3) 82%,transparent);
    pointer-events:none}
  main{position:relative;min-height:var(--page-image-height)}
  main:has(.page-body){padding-bottom:var(--content-lag)}
  .page-body{position:relative;z-index:1;isolation:isolate;margin-top:calc(var(--page-image-run) * -1);
    padding:0 var(--page-gutter) var(--space-6)}
  .forest-ground{position:absolute;inset:0 var(--leaf-bleed);overflow:clip;pointer-events:none}
  .forest-ground i{position:absolute;inset:0;
    background:var(--ground-texture) center/var(--ground-tile) repeat;filter:brightness(var(--ground-brightness))}
  .section-head{display:flex;align-items:center;gap:var(--space-3)}
  .section-icon{width:var(--section-icon);height:var(--section-icon);flex:none;
    background:linear-gradient(var(--gold-highlight),var(--gold-light) 35%,var(--gold) 80%);
    mask:var(--flat-leaf-crest) center/contain no-repeat;filter:drop-shadow(0 0 8px var(--button-arrow-glow-dim))}
  .section-head h2{font:500 clamp(24px,2.3vw,34px)/1.1 Cinzel;letter-spacing:.06em;text-transform:uppercase;margin:0;
    color:transparent;background:var(--title-metal);-webkit-background-clip:text;background-clip:text;filter:var(--metal-quiet)}
  .section-head p{margin:2px 0 0;font-size:15px;color:var(--text-muted)}
  .section-head p b{font-weight:500;color:var(--text)}
  .section-box{padding:var(--space-4) var(--space-4) var(--space-3)}
  .section-box>.section-head{margin:0 0 var(--space-4)}
  .section-box:not([hidden])~.section-box:not(.view){margin-top:calc(var(--space-5) + var(--space-3));padding-bottom:var(--space-4)}
  .switch{display:flex;flex:none;gap:var(--space-1)}
  .switch .card{width:auto;height:40px;padding:0 var(--space-3);border:0;cursor:var(--cursor-click);
    --card-radius:var(--image-radius);--inner-inset:4px;backdrop-filter:none;
    background:linear-gradient(135deg,var(--card-solid) 45%,var(--card-solid-dark));
    font:500 13px Jost;letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);
    transition:color var(--button-ease),box-shadow var(--button-ease)}
  .switch .card:hover,.switch .card:focus-visible{color:var(--gold-light);outline:none}
  .switch .card[aria-pressed="true"],.switch .card[aria-current]{color:var(--gold-light);
    --ring-fill:linear-gradient(90deg,var(--gold-dark),var(--gold) 50%,var(--gold-dark));
    box-shadow:0 0 14px color-mix(in srgb,var(--gold) 30%,transparent)}
  .switch .card[hidden],.switch-group[hidden]{display:none}
  .switch-group{position:relative}
  .switch-arrow{width:6px;height:6px;margin:-3px 0 0 var(--space-2);display:inline-block;vertical-align:middle;
    border:solid currentColor;border-width:0 1.5px 1.5px 0;rotate:45deg;transition:rotate var(--button-ease)}
  .switch-group > [aria-expanded="true"] .switch-arrow{rotate:225deg;margin-top:3px}
  .switch-menu{position:absolute;z-index:30;top:calc(100% + var(--space-1));left:50%;translate:-50% 0;min-width:100%;
    display:none;flex-direction:column;padding:var(--space-1);
    background:var(--card-solid);border:var(--border-thin) solid var(--frame-green-light);border-radius:var(--image-radius);box-shadow:var(--card-shadow)}
  .switch-group > [aria-expanded="true"] + .switch-menu{display:flex}
  .switch-menu a{padding:var(--space-2) var(--space-3);border-radius:6px;white-space:nowrap;
    font:500 13px Jost;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
  .switch-menu a:hover,.switch-menu a:focus-visible{outline:none;background:var(--field-tint);color:var(--gold-light)}
  .switch-menu a[aria-current]{color:var(--heading)}
  :root{--view-nav-height:58px;
         --view-nav-pad:32px}
  .view-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-2);
    width:fit-content;max-width:100%;margin:0 auto var(--space-3);padding-inline:var(--foliage-reach)}
  .view-nav .button{--button-height:var(--view-nav-height);--button-pad-x:var(--view-nav-pad);
    --button-min-width:0;--button-font-size:15px;letter-spacing:.14em;
    filter:drop-shadow(0 8px 14px rgba(0,0,0,.65))}
  .view-nav .button[aria-current],.view-nav .switch-group:has([aria-current])>.button{
    color:var(--gold-light);--button-tint:var(--button-hover-tint);
    --ring-fill:linear-gradient(90deg,var(--gold-dark),var(--gold) 50%,var(--gold-dark));
    box-shadow:inset 0 0 0 3px rgba(0,0,0,.35),0 2px 8px rgba(0,0,0,.6),0 0 22px var(--button-hover-glow)}
  .view-nav .is-off{cursor:var(--cursor);pointer-events:none;color:var(--text-muted);text-shadow:none;
    box-shadow:inset 0 0 0 3px rgba(0,0,0,.35);--ring-glow:none;
    filter:grayscale(1)}
  .view[hidden]{display:none}
  :is(.view,.view-body)>.panel+.panel{margin-top:var(--space-5)}
  @media (max-width:620px){
    .view-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:auto}
    .view-nav .button{--view-nav-pad:var(--space-2);--button-font-size:12px;letter-spacing:.08em}
    .view-nav .switch-group>.button{width:100%}
  }
  .reading{width:min(100%,var(--reading-width));margin-inline:auto;padding:var(--space-5) var(--space-5) var(--space-4)}
  .reading.wide{--reading-width:108ch}
  .reading-lead{margin:0 0 var(--space-4);font-size:18px;line-height:1.65;color:var(--text)}
  .chapter{margin:var(--space-5) 0 0}
  .chapter-title{display:flex;align-items:baseline;gap:var(--space-3);margin:0 0 var(--space-3);
    font:500 24px/1.2 Cinzel;letter-spacing:.05em;text-transform:uppercase;
    color:transparent;background:var(--title-metal);-webkit-background-clip:text;background-clip:text;filter:var(--metal-quiet)}
  .chapter-no{min-width:2.2ch;font-size:.8em;letter-spacing:.08em}
  .chapter-list{margin:0}
  .rule{padding:var(--space-2) 0}
  .rule+.rule{background:var(--rule-top)}
  .rule dt{font:500 17px Jost;color:var(--heading)}
  .rule dd{margin:2px 0 0;font-size:16px;line-height:1.6;color:var(--text)}
  .reading-end{margin:var(--space-5) 0 0;padding-top:var(--space-3);font-size:16px;line-height:1.6;color:var(--text-muted);
    background:var(--rule-top)}
  .reading-end em{color:var(--heading);font-style:normal}
  .channel{white-space:nowrap;padding:0 var(--space-1);border-radius:4px;color:var(--gold-light);background:var(--field-tint)}
  @media (max-width:900px){
    .reading{padding:var(--space-4) var(--space-3) var(--space-3)}
  }
  @media (max-width:620px){
    .chapter-title{font-size:20px}
  }
  .panel{width:auto;height:auto;display:flex;flex-direction:column;place-content:normal;text-align:left;
    --panel-pad-x:var(--space-4);--panel-pad-top:var(--space-3);--panel-pad-bottom:var(--space-4);
    background:linear-gradient(135deg,var(--card-solid) 45%,var(--card-solid-dark));backdrop-filter:none;box-shadow:var(--card-shadow);
    padding:var(--panel-pad-top) var(--panel-pad-x) var(--panel-pad-bottom)}
  .panel[hidden]{display:none}
  .well{display:block;padding:var(--space-4);border-radius:var(--card-radius);corner-shape:var(--corner-shape);
    background:var(--field-ground);box-shadow:var(--well-shadow)}
  .well[hidden]{display:none}
  .panel-head{display:flex;align-items:center;gap:var(--space-3);
    margin:calc(var(--panel-pad-top) * -1) calc(var(--panel-pad-x) * -1) 0;
    padding:calc(var(--panel-pad-top) + var(--space-1)) var(--panel-pad-x) var(--space-3);
    border-radius:var(--card-radius) var(--card-radius) 0 0;corner-shape:var(--corner-shape);
    background:
      var(--rule-gradient) center 100%/calc(100% - var(--panel-pad-x) * 2) var(--border-thin) no-repeat,
      linear-gradient(var(--box-band-edge),var(--box-band-line))}
  .panel-head.is-foldable{cursor:var(--cursor-click)}
  .panel-head.is-foldable:hover .panel-fold{color:var(--gold-light)}
  .panel-fold{margin-left:auto;flex:none;width:32px;height:32px;padding:0;border:0;background:none;
    cursor:var(--cursor-click);color:var(--gold);font:400 24px/1 Jost;
    transition:color var(--button-ease),rotate var(--button-ease)}
  .panel-fold::before{content:"›"}
  .panel-fold[aria-expanded="true"]{rotate:90deg}
  .panel-fold:hover,.panel-fold:focus-visible{color:var(--gold-light);outline:none}
  .panel-head>.panel-fold:not(:nth-child(3)){margin-left:var(--space-3)}
  .panel.is-folded>.panel-head{padding-bottom:calc(var(--panel-pad-top) + var(--space-1));
    margin-bottom:calc(var(--panel-pad-bottom) * -1);border-radius:var(--card-radius)}
  .panel-body[hidden]{display:none}
  .panel .panel-foot{margin:var(--space-3) calc(var(--panel-pad-x) * -1) calc(var(--panel-pad-bottom) * -1);
    padding:var(--space-3) var(--panel-pad-x) var(--panel-pad-bottom);
    border-radius:0 0 var(--card-radius) var(--card-radius);corner-shape:var(--corner-shape);
    background:
      var(--rule-gradient) center 0/calc(100% - var(--panel-pad-x) * 2) var(--border-thin) no-repeat,
      linear-gradient(var(--box-band-line),var(--box-band-edge))}
  .painted{width:var(--painted-size);height:var(--painted-size);flex:none;object-fit:contain;filter:var(--painted-depth)}
  .panel-icon{width:var(--icon-module);height:var(--icon-module);flex:none;
    background:linear-gradient(var(--gold-light),var(--gold) 70%);
    mask:var(--icon) center/contain no-repeat}
  .panel-head h2{font:500 23px Cinzel;color:var(--heading-light);letter-spacing:.05em;text-transform:uppercase;margin:0}
  .panel-head h2{color:transparent;background:var(--title-metal);-webkit-background-clip:text;background-clip:text;filter:var(--metal-quiet)}
  .panel-head a{margin-left:auto;font:500 15px Jost;color:var(--text);white-space:nowrap}
  .panel-head a span{color:var(--gold);margin-left:2px;display:inline-block;transition:translate var(--button-ease)}
  .panel-head a:hover{color:var(--heading)}
  .panel-head a:hover span{translate:3px 0}
  .panel .panel-text{margin:var(--space-3) 0 0;font-size:17px;line-height:1.6}
  .item-list{list-style:none;margin:0;padding:0;flex:1;display:flex;flex-direction:column}
  .item-list li{flex:1;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) 0}
  .item-list li+li{background:var(--rule-gradient) 0 0/var(--rule-size) var(--border-thin) no-repeat}
  .item-list h3{font:500 19px Jost;color:var(--text);margin:0 0 2px}
  .item-list p{margin:0;font-size:15px}
  .meta{font-size:14px;color:var(--text-muted);margin:0 0 2px}
  .date-badge{width:72px;height:72px;flex:none;display:grid;place-content:center;text-align:center;
    background:var(--field-tint);border:var(--border-thin) solid var(--rule-line);
    border-radius:var(--image-radius);corner-shape:var(--corner-shape)}
  .date-badge small{font:500 13px Jost;letter-spacing:.14em;text-transform:uppercase;color:var(--heading)}
  .date-badge b{font:600 30px/1 Cinzel;color:var(--text)}
  .rsvp-count{margin-left:auto;font-size:14px;color:var(--text-muted);white-space:nowrap}
  .avatar{width:var(--avatar-size);height:var(--avatar-size);border-radius:50%;display:grid;place-content:center;
    overflow:clip;font:600 34px Cinzel;color:var(--heading);background:var(--field-tint);
    border:var(--border-gold) solid var(--class-color,var(--gold-dark));box-shadow:inset 0 0 0 3px var(--green-deepest)}
  .avatar:has(img){box-shadow:none;background:var(--green-deepest)}
  .avatar img{width:100%;height:100%;object-fit:cover;display:block}
  .clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
  .tag{--tag-color:var(--gold);display:inline-block;white-space:nowrap;
    padding:2px var(--space-2);border-radius:999px;font:500 11px Jost;letter-spacing:.14em;text-transform:uppercase;
    color:color-mix(in srgb,var(--tag-color) 40%,white);border:var(--border-thin) solid color-mix(in srgb,var(--tag-color) 85%,white 15%);
    background:color-mix(in srgb,var(--tag-color) 30%,transparent)}
  .openings{--opening-role-row:246px;
    list-style:none;margin:var(--space-2) 0 0;padding:0;flex:1;display:flex;flex-direction:column;gap:var(--space-2)}
  .opening-role{position:relative;flex:1 0 auto;padding:var(--space-2) var(--space-3) var(--space-3);
    border:var(--border-thin) solid color-mix(in srgb,var(--old-gold) 45%,transparent);
    border-radius:var(--image-radius);corner-shape:var(--corner-shape);
    background:linear-gradient(90deg,var(--card-solid) 15%,color-mix(in srgb,var(--card-solid) 55%,transparent) 55%,transparent),
      var(--role-art,none) right 30%/cover no-repeat,var(--card-solid)}
  .opening-role[data-role="tank"]  {--role-art:url("/assets/site/game/talents/warrior-protection.webp")}
  .opening-role[data-role="heiler"]{--role-art:url("/assets/site/game/talents/priest-holy.webp")}
  .opening-role[data-role="melee"] {--role-art:url("/assets/site/game/talents/rogue-subtlety.webp")}
  .opening-role[data-role="range"] {--role-art:url("/assets/site/game/talents/mage-frost.webp")}
  .opening-role-head{display:flex;align-items:center;gap:var(--space-2);--painted-size:32px}
  .opening-role-head h3{margin:0;font:500 18px Cinzel;letter-spacing:.08em;text-transform:uppercase;color:var(--heading);
    text-shadow:var(--text-shadow-soft)}
  .opening-role.is-idle{flex:0 0 auto;padding-bottom:var(--space-2);filter:grayscale(1);opacity:.45}
  .opening-idle{margin-left:auto;font-size:14px;font-style:italic;color:var(--text-muted)}
  .opening-classes{list-style:none;margin:var(--space-3) 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3) var(--space-4)}
  .opening-class{display:grid;justify-items:center;gap:4px;min-width:84px}
  .opening-emblem{width:64px;height:64px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.8))}
  .opening-specs{position:relative;display:flex;gap:3px;margin-top:-16px}
  .opening-class-name{font:500 13px/1.2 Jost;color:var(--class-color);text-align:center;text-shadow:var(--text-shadow)}
  .opening-spec{width:26px;height:26px;flex:none;cursor:help;border-radius:50%;
    border:2px solid var(--class-color);box-shadow:0 2px 4px rgba(0,0,0,.8);
    transition:transform var(--button-ease)}
  .opening-spec:hover,.opening-spec:focus-visible{transform:scale(1.2);outline:none}
  .opening-spec.is-off{filter:grayscale(1) brightness(.45);border-color:var(--text-muted)}
  .opening-rest{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3);padding-top:var(--space-2);
    background:var(--rule-top)}
  .opening-rest img{width:30px;height:30px;filter:grayscale(1) brightness(.6);opacity:.6}
  .openings.is-capped{--opening-fade:28px;overflow-y:auto;overscroll-behavior:contain;
    scrollbar-width:thin;scrollbar-color:var(--old-gold) transparent;
    mask-image:linear-gradient(to bottom,black calc(100% - var(--opening-fade)),transparent)}
  .openings.is-teaser{overflow:hidden;mask-image:linear-gradient(to bottom,black 35%,transparent 92%)}
  .openings-more{position:relative;z-index:1;display:flex;justify-content:center;margin-top:calc(var(--space-6) * -.75)}
  .openings-more .button{--button-height:60px;--button-font-size:16px;--button-pad-x:40px;letter-spacing:.12em;
    box-shadow:inset 0 0 0 3px rgba(0,0,0,.35),0 4px 12px rgba(0,0,0,.6),0 0 40px var(--button-hover-glow)}
  :root{
    --portrait-size:46px;
    --fact-icon:68px;
  }
  .roster-board{display:grid;grid-template-columns:minmax(0,3fr) var(--border-thin) minmax(0,1fr);gap:var(--space-4);align-items:start}
  .roster-roles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4);align-items:start}
  .roster-column{display:grid;gap:var(--space-4)}
  .roster-divider{align-self:stretch;background:linear-gradient(transparent,var(--old-gold) 12%,var(--old-gold) 88%,transparent)}
  .roster-list{list-style:none;margin:0;padding:0}
  .roster-list li{display:grid;grid-template-columns:var(--portrait-size) minmax(0,1fr) auto;grid-template-rows:auto auto;
    column-gap:var(--space-3);align-items:center;padding:var(--space-2) 0}
  .roster-list li+li{background:var(--rule-top)}
  .roster-list .portrait{grid-row:1 / 3;width:var(--portrait-size);height:var(--portrait-size);object-fit:cover;
    border-radius:var(--image-radius);border:var(--border-gold) solid var(--old-gold-strong);background:var(--field-tint);
    box-shadow:0 2px 6px rgba(0,0,0,.6)}
  .roster-list .name{grid-column:2;align-self:end;font:500 18px/1.2 Jost;color:var(--class-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .roster-list .spec{grid-column:2;align-self:start;font-size:14px;line-height:1.3;color:var(--text-muted)}
  .roster-list .stats{grid-column:3;grid-row:1 / 3;position:relative;isolation:isolate;display:grid;justify-items:end;align-content:center;
    gap:2px;min-width:calc(var(--portrait-size) + var(--space-3));min-height:var(--portrait-size)}
  .roster-list .class-mark{position:absolute;z-index:-1;left:50%;top:50%;translate:-50% -50%;
    width:calc(var(--portrait-size) + var(--space-2));height:calc(var(--portrait-size) + var(--space-2));
    opacity:.22;pointer-events:none;mask:radial-gradient(closest-side,black 55%,transparent)}
  .roster-list .ilvl{font-size:15px;color:var(--text)}
  .roster-list .rio{font-size:13px;color:var(--rio-color,var(--text-muted))}
  .panel-head .count{margin-left:auto;font:500 15px Jost;color:var(--text-muted)}
  .fact-list{list-style:none;margin:var(--space-3) 0 0;padding:0;display:grid;gap:var(--space-3);align-content:start}
  .fact-list li{display:flex;align-items:center;gap:var(--space-4)}
  .fact-list h3{margin:0;font:500 17px Jost;letter-spacing:.03em;color:var(--heading-light)}
  .fact-list p{margin:2px 0 0;font-size:15px;line-height:1.45;color:var(--text-muted)}
  .fact-list .painted{width:var(--fact-icon);height:var(--fact-icon)}
  @media (max-width:1240px){
    .roster-board{grid-template-columns:minmax(0,1fr)}
    .roster-divider{display:none}
  }
  @media (max-width:900px){.roster-roles{grid-template-columns:minmax(0,1fr)}}
  @media (max-width:620px){
    .roster-list li{column-gap:var(--space-2)}
    .roster-list .name{font-size:16px}
    .roster-list .stats{min-width:var(--portrait-size)}
  }
  .tip{position:fixed;z-index:60;max-width:300px;padding:var(--space-2) var(--space-3);pointer-events:none;
    background:var(--card-solid);border:var(--border-thin) solid var(--old-gold-strong);
    border-radius:var(--image-radius);corner-shape:var(--corner-shape);box-shadow:0 10px 28px rgba(0,0,0,.8);
    font-size:14px;line-height:1.4;color:var(--text)}
  .tip b{display:block;margin-bottom:2px;font:500 16px Cinzel;letter-spacing:.06em;color:var(--heading)}
  .tip[hidden]{display:none}
  @media (hover:none){.tip{display:none}}
  .is-clickable:focus-visible{outline:none;
    box-shadow:inset 0 0 0 1px var(--class-color,var(--gold-dark))}
  .profile-body{display:flex;flex-direction:column;gap:var(--space-3)}
  .profile-head{display:flex;align-items:center;gap:var(--space-3)}
  .profile-face{width:64px;height:64px;flex:none;border-radius:50%;object-fit:cover;
    box-shadow:0 0 0 2px var(--gold-dark)}
  .profile-who{display:flex;flex-direction:column;gap:2px;min-width:0}
  .profile-who strong{font:500 20px Cinzel;letter-spacing:.04em;color:var(--heading)}
  .profile-sub{font-size:14px;color:var(--text-muted)}
  .profile-body .profile-section{margin:var(--space-2) 0 0;font:500 16px Cinzel;letter-spacing:.06em;
    color:var(--heading);border-bottom:var(--border-thin) solid var(--rule-top);
    padding-bottom:var(--space-1)}
  .profile-chars{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
  .profile-chars li{display:flex;align-items:baseline;gap:var(--space-2);flex-wrap:wrap;
    padding:var(--space-1) var(--space-2);border-radius:var(--image-radius);
    corner-shape:var(--corner-shape)}
  .profile-chars li+li{background:var(--rule-top)}
  .profile-chars li.is-main{background:var(--field-tint)}
  .profile-chars li.is-main+li{background:none}
  .profile-char-name{color:var(--class-color,var(--text));font-weight:500}
  .profile-char-data{font-size:14px;color:var(--text-muted)}
  .profile-tag{flex:none;font-size:12px;letter-spacing:.08em;text-transform:uppercase;
    color:var(--old-gold)}
  .profile-feat+.profile-feat{margin-top:var(--space-2)}
  .profile-feat-title{margin:0 0 var(--space-1);font-size:15px;color:var(--old-gold);
    letter-spacing:.04em}
  .profile-feat-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
  .profile-feat-list li{display:flex;align-items:center;gap:var(--space-2)}
  .profile-feat-icon{width:26px;height:26px;flex:none;object-fit:contain}
  .profile-feat-name{flex:none;color:var(--text)}
  .profile-feat-cond{font-size:13px;color:var(--text-muted);min-width:0;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  @media (max-width:620px){
    .profile-face{width:48px;height:48px}
    .profile-feat-cond{white-space:normal}
  }
  .empty-note{margin:var(--space-3) 0 0;color:var(--text-muted);font-style:italic}
  @media (max-width:620px){
    :root{--icon-module:26px}
    .panel{--panel-pad-x:var(--space-3);--panel-pad-top:var(--space-2);--panel-pad-bottom:var(--space-3)}
    .well{padding:var(--space-3)}
    .panel-head{gap:var(--space-2)}
    .panel-head h2{font-size:18px}
    .panel-head a{font-size:13px}
    .item-list li{gap:var(--space-2);padding:var(--space-2) 0;flex-wrap:wrap}
    .item-list li>*{min-width:0}
    .rsvp-count{margin:var(--space-1) 0 0 auto}
    .text-cloud::before{inset:calc(var(--space-6) * -1) calc(var(--space-5) * -1)}
    .page-title .motto{font-size:13px;letter-spacing:.2em}
  }
  @media (pointer:coarse){
    .main-nav a{min-height:44px;display:grid;align-content:center}
    .panel-head a,.site-footer nav a,.brand{min-height:44px;display:inline-flex;align-items:center}
  }
  .event-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-2)}
  .event-row{position:relative;width:auto;height:auto;min-height:var(--event-row-height);overflow:clip;
    display:grid;grid-template-columns:var(--event-date-width) var(--event-kind-width) 1fr auto;align-items:center;text-align:left;place-content:normal;
    background:linear-gradient(135deg,var(--card-solid) 45%,var(--card-solid-dark));backdrop-filter:none;
    box-shadow:0 10px 22px rgba(0,0,0,.6)}
  .event-kind{position:relative;justify-self:center;width:var(--event-kind-size);height:var(--event-kind-size);
    background:var(--art-icon) center/contain no-repeat;
    filter:drop-shadow(0 0 10px color-mix(in srgb,var(--art-color) 70%,transparent)) drop-shadow(0 2px 3px rgba(0,0,0,.7))}
  .event-motif{position:absolute;right:0;top:0;width:var(--event-motif-width);height:100%;object-fit:cover;pointer-events:none;
    mask:linear-gradient(90deg,transparent,rgba(0,0,0,.35) 30%,black 75%)}
  .event-date{position:relative;align-self:stretch;display:grid;place-content:center;justify-items:center;gap:2px}
  .event-date::before,.event-date::after{content:"";position:absolute;top:16%;bottom:16%;pointer-events:none}
  .event-date::before{right:-4px;width:10px;filter:blur(3px);
    background:linear-gradient(transparent,var(--art-color) 25%,var(--art-color) 75%,transparent)}
  .event-date::after{right:0;width:2px;border-radius:1px;
    background:linear-gradient(transparent,color-mix(in srgb,var(--art-color) 45%,white) 18%,color-mix(in srgb,var(--art-color) 30%,white) 50%,color-mix(in srgb,var(--art-color) 45%,white) 82%,transparent)}
  .event-date b{font:500 38px/1 Cinzel;color:var(--gold-light)}
  .event-date small{font:500 12px Jost;letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted)}
  .event-body{position:relative;padding:var(--space-2) var(--space-4) var(--space-2) var(--space-1);max-width:62ch}
  .event-row .event-title{font:600 26px/1.2 Cinzel;letter-spacing:.04em;text-transform:uppercase;color:var(--heading-light);margin:0}
  .card .event-about{margin:2px 0 0;font-size:15px;color:var(--text-muted)}
  .event-facts{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-1) var(--space-4);margin-top:var(--space-1);font-size:14px;color:var(--text)}
  .fact{display:inline-flex;align-items:center;gap:var(--space-1)}
  .fact-icon{width:16px;height:16px;color:var(--gold)}
  .fact-cancelled{color:var(--archived);font-weight:500}
  .own-answer{padding:6px var(--space-4) 6px 6px;border-radius:999px;font:600 17px Jost;letter-spacing:.02em;
    color:color-mix(in srgb,var(--answer-color) 85%,white);border:var(--border-thin) solid var(--answer-color);
    background:color-mix(in srgb,var(--answer-color) 22%,var(--card-solid-dark));box-shadow:0 0 12px color-mix(in srgb,var(--answer-color) 35%,transparent)}
  .own-answer::before{content:attr(data-mark);display:grid;place-content:center;width:26px;height:26px;border-radius:50%;
    font:700 15px/1 Jost;color:var(--card-solid-dark);background:var(--answer-color)}
  .signup-when{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-3)}
  .stand-zu{--answer-color:var(--stand-zu)}
  .stand-ab{--answer-color:var(--stand-ab)}
  .stand-spaeter{--answer-color:var(--stand-spaeter)}
  .stand-bank{--answer-color:var(--stand-bank)}
  .stand-offen{--answer-color:var(--stand-open)}
  .event-facts .tag{--tag-color:var(--art-color)}
  .art-raid{--art-color:var(--art-raid);--art-icon:url("/assets/site/game/kinds/raid.webp")}
  .art-mplus{--art-color:var(--art-mplus);--art-icon:url("/assets/site/game/kinds/mplus.webp")}
  .art-social{--art-color:var(--art-social);--art-icon:url("/assets/site/game/kinds/social.webp")}
  .art-gildenbesprechung{--art-color:var(--art-gildenbesprechung);--art-icon:url("/assets/site/game/kinds/guild-meeting.webp")}
  .art-leitungsbesprechung{--art-color:var(--art-leitungsbesprechung);--art-icon:url("/assets/site/game/kinds/lead-meeting.webp")}
  .art-geburtstag{--art-color:var(--art-geburtstag);--art-icon:url("/assets/site/game/kinds/birthday.webp")}
  .event-side{position:relative;z-index:2;display:grid;justify-items:end;gap:var(--space-2);margin-right:var(--space-4)}
  .event-archived{
    padding:3px var(--space-2);border-radius:var(--image-radius);font:700 12px Jost;letter-spacing:.16em;text-transform:uppercase;
    color:var(--archived);border:var(--border-thin) solid var(--archived);background:rgba(0,0,0,.55)}
  .event-row.is-cancelled{opacity:.6}
  .event-row.is-cancelled .event-motif,.event-row.is-past .event-motif{filter:grayscale(1) brightness(.7)}
  .event-list .empty-note{margin:0;padding:var(--space-2) 0}
  .event-more{position:absolute;top:var(--space-2);right:var(--space-2);z-index:3;width:34px;height:34px;
    display:grid;place-content:center;padding:0 0 4px;border:var(--border-thin) solid color-mix(in srgb,var(--gold) 45%,transparent);
    border-radius:50%;background:rgba(0,0,0,.55);font:700 20px/1 Jost;color:var(--gold-light);cursor:var(--cursor-click)}
  .event-more:hover,.event-more:focus-visible{outline:none;border-color:var(--gold);background:rgba(0,0,0,.8)}
  .event-more:disabled{opacity:.5;cursor:var(--cursor)}
  .event-row.has-tools .event-side{margin-right:56px}
  @media (pointer:coarse){.event-more{width:44px;height:44px}}
  @media (max-width:1240px){:root{--event-date-width:96px;--event-kind-width:68px;--event-motif-width:34%}}
  @media (max-width:900px){.event-body{padding-right:var(--space-3)}}
  @media (max-width:620px){
    :root{--event-date-width:auto;--event-kind-size:30px}
    .event-row{grid-template-columns:auto minmax(0,1fr);
      grid-template-areas:"date body" "side side";
      align-items:start;gap:0 var(--space-2);min-height:0;padding:var(--space-2) var(--space-2) var(--space-3)}
    .event-date{grid-area:date;align-self:start;gap:0}
    .event-date::before,.event-date::after{content:none}
    .event-kind{grid-area:date;align-self:end;justify-self:center}
    .event-body{grid-area:body;padding:0;max-width:none}
    .event-side,.event-row.has-tools .event-side{grid-area:side;margin:var(--space-2) 0 0}
    .event-row.has-tools .event-body{padding-right:48px}
    .own-answer{font-size:15px}
    .event-motif{display:none}
    .event-date b{font-size:28px}
    .event-date small{font-size:11px;letter-spacing:.12em}
    .event-row .event-title{font-size:16px}
    .event-body p{font-size:14px}
  }
  .field{display:grid;gap:var(--space-1);margin:0 0 var(--space-3)}
  .field[hidden]{display:none}
  .field>span{font:500 13px Jost;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
  .field input,.field textarea,.field select{width:100%;box-sizing:border-box;padding:var(--space-2) var(--space-3);
    font:400 16px/1.5 Jost;color:var(--text);background:var(--field-fill);
    border:var(--border-thin) solid var(--field-line);border-radius:var(--image-radius);corner-shape:var(--corner-shape);
    transition:border-color var(--button-ease),box-shadow var(--button-ease)}
  .field textarea{resize:vertical;min-height:6lh}
  .field input:focus-visible,.field textarea:focus-visible,.field select:focus-visible{outline:none;border-color:var(--gold);
    box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 22%,transparent)}
  .field ::placeholder{color:var(--text-muted);opacity:.6}
  .field-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));column-gap:var(--space-3)}
  p.field-hint{margin:calc(var(--space-2) * -1) 0 var(--space-3);font-size:14px;color:var(--text-muted)}
  .check{display:inline-flex;align-items:center;gap:var(--space-2);margin:0 0 var(--space-3);
    cursor:var(--cursor-click);color:var(--text)}
  .check input{appearance:none;-webkit-appearance:none;
    width:20px;height:20px;margin:0;flex:none;cursor:var(--cursor-click);
    display:grid;place-content:center;
    background:var(--field-fill);
    border:var(--border-thin) solid var(--field-line);
    border-radius:4px;
    transition:border-color var(--button-ease),box-shadow var(--button-ease)}
  .check input::before{content:"";width:6px;height:11px;margin-top:-3px;
    border:solid var(--gold-light);border-width:0 2px 2px 0;rotate:45deg;
    scale:0;transition:scale var(--button-ease)}
  .check input:checked{border-color:var(--gold);
    box-shadow:inset 0 0 8px color-mix(in srgb,var(--gold) 22%,transparent)}
  .check input:checked::before{scale:1}
  .check input:focus-visible{outline:none;border-color:var(--gold);
    box-shadow:0 0 0 3px color-mix(in srgb,var(--gold) 22%,transparent)}
  .check:hover input:not(:checked){border-color:var(--gold-dark)}
  @media (prefers-reduced-motion:reduce){.check input::before{transition:none}}
  .check-row .check{margin:0}
  .notice{margin:var(--space-2) 0 0;font-size:15px;color:var(--text-muted)}
  .notice:empty{display:none}
  .notice.is-good{color:var(--notice-good)}
  .notice.is-bad{color:var(--notice-bad)}
  .notice.is-warn{color:var(--warning)}
  .vol{width:96px;appearance:none;-webkit-appearance:none;height:14px;background:none;cursor:var(--cursor-click)}
  .vol::-webkit-slider-runnable-track{height:3px;border-radius:2px;
    background:linear-gradient(90deg,var(--gold) 0 var(--at,80%),var(--progress-open) var(--at,80%) 100%)}
  .vol::-moz-range-track{height:3px;border-radius:2px;
    background:linear-gradient(90deg,var(--gold) 0 var(--at,80%),var(--progress-open) var(--at,80%) 100%)}
  .vol::-webkit-slider-thumb{-webkit-appearance:none;width:10px;height:10px;margin-top:-3.5px;border-radius:50%;background:var(--gold-light)}
  .vol::-moz-range-thumb{width:10px;height:10px;border:0;border-radius:50%;background:var(--gold-light)}
  .vol:focus-visible{outline:none}
  .vol:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px var(--button-arrow-glow-dim)}
  .door-notice{display:flex;flex-direction:row;gap:var(--space-3);align-items:center;
    width:min(100% - 2 * var(--page-gutter),56rem);margin:var(--space-4) auto 0}
  .door-notice .painted{flex:0 0 auto;width:32px;height:32px}
  .door-notice .notice{margin:0}
  .apply-door{margin:var(--space-2) 0 0;font-size:15px;color:var(--text-muted)}
  .text-button{border:0;background:none;padding:var(--space-1) 0;cursor:var(--cursor-click);
    font:500 13px Jost;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);transition:color var(--button-ease)}
  .text-button:hover,.text-button:focus-visible{color:var(--gold-light);outline:none}
  .text-button.is-armed{color:var(--notice-bad)}
  .panel-tools{margin-left:auto;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:var(--space-2)}
  .panel-tools .button{--button-height:34px;--button-pad-x:var(--space-3);--button-min-width:0;--button-font-size:12px}
  .panel-tools[hidden]{display:none}
  .view-tools{display:flex;justify-content:flex-end;gap:var(--space-3);margin:0 0 var(--space-4)}
  .view-tools[hidden]{display:none}
  .sheet{width:min(720px,calc(100vw - var(--space-4)));height:fit-content;max-height:calc(100dvh - var(--space-5));
    padding:0;border:0;color:var(--text);overflow:visible;-webkit-backdrop-filter:none;backdrop-filter:none}
  .sheet:not([open]){display:none}
  .sheet[open]{display:block}
  .sheet::backdrop{background:var(--sheet-backdrop);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
  .sheet-form{display:flex;flex-direction:column;max-height:inherit;overflow:auto;
    padding:var(--panel-pad-top) var(--panel-pad-x) var(--panel-pad-bottom)}
  .sheet .panel-head{margin-bottom:var(--space-4)}
  .sheet-actions{display:flex;justify-content:flex-end;align-items:center;gap:var(--space-4);margin-top:var(--space-3)}
  .sheet.is-narrow{width:min(460px,calc(100vw - var(--space-4)))}
  :root{--sheet-wide:1100px; --lineup-face:24px}
  .sheet.is-wide{width:min(var(--sheet-wide),calc(100vw - var(--space-4)))}
  .lineup-board{display:grid;gap:var(--space-4)}
  .lineup-top,.lineup-bottom{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-3)}
  .lineup-top.is-single{grid-template-columns:minmax(0,1fr)}
  .lineup-bottom{padding-top:var(--space-3);background:var(--rule-top);opacity:.85}
  .lineup-column h3{display:flex;align-items:center;gap:var(--space-2);margin:0 0 var(--space-2);
    font:500 13px Jost;letter-spacing:.14em;text-transform:uppercase;color:var(--heading)}
  .lineup-role{width:18px;height:18px}
  .lineup-count{margin-left:auto;color:var(--text-muted)}
  .lineup-column ul{list-style:none;margin:0;padding:0}
  .lineup-empty{color:var(--text-muted)}
  .lineup-name{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--space-2);width:100%;padding:var(--space-1) 18px var(--space-1) 0;
    border:0;background:none;cursor:var(--cursor-click);text-align:left;font:inherit;color:var(--text)}
  .lineup-name:hover .editable-pen,.lineup-name:focus-visible .editable-pen{opacity:1}
  .lineup-name:focus-visible{outline:none}
  .lineup-face{width:var(--lineup-face);height:var(--lineup-face);border-radius:50%;object-fit:cover}
  .lineup-char{color:var(--class-color,var(--text))}
  .lineup-person{color:var(--text-muted)}
  .lineup-person::before{content:"| ";color:var(--old-gold)}
  .lineup-name small{flex-basis:100%;padding-left:calc(var(--lineup-face) + var(--space-2));font-size:13px;color:var(--text-muted)}
  .lineup-name.is-plain{cursor:var(--cursor);padding-right:0}
  @media (max-width:900px){
    .lineup-top,.lineup-bottom{grid-template-columns:repeat(2,minmax(0,1fr))}
  }
  .sheet-gap{flex:1}
  .is-signable{cursor:var(--cursor-click)}
  .sheet.signup-sheet:not(.is-wide){width:min(620px,calc(100vw - var(--space-4)))}
  .signup-lineup{margin-top:var(--space-4);padding-top:var(--space-4);background:var(--rule-top)}
  .signup-lineup-head{margin:0 0 var(--space-3);font:500 13px Jost;letter-spacing:.14em;
    text-transform:uppercase;color:var(--heading)}
  .signup-closed{margin:var(--space-4) 0 0;color:var(--text-muted)}
  .signup-sheet:not(.is-wide) .lineup-bottom{grid-template-columns:repeat(2,minmax(0,1fr))}
  .signup-sheet .panel-text{margin:0 0 var(--space-3)}
  .signup-sheet .sheet-actions .button{--button-min-width:0;--button-pad-x:var(--space-4);white-space:nowrap}
  .sheet-text{margin:0 0 var(--space-3);color:var(--text);line-height:1.55}
  @media (max-width:620px){
    .sheet-actions{flex-wrap:wrap;justify-content:center}
    .signup-sheet .field-row{grid-template-columns:1fr}
    .signup-sheet .sheet-gap{display:none}
    .signup-sheet .sheet-actions .button{flex:1 1 100%}
    .signup-sheet .sheet-actions [type=submit]{order:-1}
    .signup-sheet .sheet-actions .text-button{order:1;flex-basis:100%}
  }
  .select{display:inline-block;min-width:0}
  .select-button{display:inline-flex;align-items:center;gap:var(--space-1);max-width:100%;border:0;background:none;padding:var(--space-1) 0;
    cursor:var(--cursor-click);font:inherit;color:inherit;text-align:left}
  .select-button:disabled{cursor:var(--cursor)}
  .select-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .select-arrow{width:8px;height:8px;flex:none;margin-top:-4px;border:solid var(--gold);border-width:0 1.5px 1.5px 0;rotate:45deg;
    transition:rotate var(--button-ease)}
  .select-button[aria-expanded="true"] .select-arrow{rotate:225deg;margin-top:4px}
  .select-button:disabled .select-arrow{display:none}
  .select-button:hover,.select-button:focus-visible{outline:none;color:var(--gold-light)}
  .field .select{display:block}
  .field .select-button{width:100%;justify-content:space-between;padding:var(--space-2) var(--space-3);
    background:var(--field-fill);border:var(--border-thin) solid var(--field-line);border-radius:var(--image-radius);corner-shape:var(--corner-shape)}
  .select-list{position:fixed;z-index:40;left:var(--select-x,0);top:var(--select-y,0);min-width:max(var(--select-w,0px),160px);
    max-height:min(360px,60vh);overflow-y:auto;margin:var(--space-1) 0;padding:var(--space-1);list-style:none;
    background:var(--card-solid);border:var(--border-thin) solid var(--frame-green-light);border-radius:var(--image-radius);
    box-shadow:var(--card-shadow);scrollbar-width:thin;scrollbar-color:var(--old-gold) transparent}
  .select-list li{padding:var(--space-1) var(--space-3);border-radius:6px;cursor:var(--cursor-click);white-space:nowrap;color:var(--text)}
  .select-list li[aria-selected="true"]{color:var(--heading)}
  .select-list li.is-marked,.select-list li:hover{background:var(--field-tint);color:var(--gold-light)}
  .date-field{position:relative;display:block}
  .date-field .select-arrow{position:absolute;right:var(--space-3);top:50%;translate:0 -50%;margin-top:-2px;cursor:var(--cursor-click)}
  .date-field input{padding-right:calc(var(--space-3) * 2 + 8px)}
  .date-field input[aria-expanded="true"]~.select-arrow{rotate:225deg;margin-top:4px}
  .date-pick{position:fixed;z-index:40;left:var(--pick-x,0);top:var(--pick-y,0);width:272px;margin:var(--space-1) 0;padding:var(--space-2);
    background:var(--card-solid);border:var(--border-thin) solid var(--frame-green-light);border-radius:var(--image-radius);
    box-shadow:var(--card-shadow)}
  .date-pick-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-1)}
  .date-pick-head b{font:500 15px Cinzel;letter-spacing:.06em;color:var(--heading)}
  .date-pick-head button{width:32px;height:32px;border:0;border-radius:6px;background:none;font:500 22px/1 Jost;color:var(--gold);
    cursor:var(--cursor-click)}
  .date-pick-head button:hover{background:var(--field-tint);color:var(--gold-light)}
  .date-pick-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;text-align:center}
  .pick-weekday{padding:var(--space-1) 0;font:500 11px Jost;letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted)}
  .pick-day{height:34px;border:0;border-radius:6px;background:none;font:400 14px Jost;font-variant-numeric:tabular-nums;color:var(--text);
    cursor:var(--cursor-click)}
  .pick-day:hover{background:var(--field-tint);color:var(--gold-light)}
  .pick-day.is-other{color:var(--text-muted);opacity:.55}
  .pick-day.is-today{box-shadow:inset 0 0 0 var(--border-thin) var(--old-gold)}
  .pick-day.is-chosen{background:var(--field-tint);color:var(--gold-light);font-weight:600;box-shadow:inset 0 0 0 var(--border-thin) var(--gold)}
  .series-note .text-button{margin-left:var(--space-1)}
  .editable{position:relative;display:inline-flex;align-items:center;max-width:100%;border:0;background:none;padding:0 18px 0 0;
    cursor:var(--cursor-click);font:inherit;color:inherit;text-align:left}
  .editable-value{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .editable.is-empty{color:var(--text-muted)}
  .editable-pen{position:absolute;right:0;top:50%;width:12px;height:12px;translate:0 -50%;opacity:0;
    background:var(--gold-light);mask:var(--pen-mark) center/contain no-repeat;transition:opacity var(--button-ease)}
  .editable:hover .editable-pen,.editable:focus-visible .editable-pen{opacity:1}
  .editable:focus-visible{outline:none;color:var(--gold-light)}
  .vine-frame{position:relative;isolation:isolate;container-type:inline-size;
    background:var(--vine-fill);-webkit-backdrop-filter:blur(var(--vine-blur));backdrop-filter:blur(var(--vine-blur));box-shadow:var(--card-shadow)}
  .vine-frame::before,.vine-frame::after{content:"";position:absolute;pointer-events:none;
    inset:calc(var(--vine-rail-top) * -1) calc(var(--vine-rail-right) * -1) calc(var(--vine-rail-bottom) * -1) calc(var(--vine-rail-left) * -1)}
  .vine-frame::before{z-index:1;border:0 solid transparent;filter:var(--vine-shadow);
    border-image:url("/assets/site/decor/border/frame.webp") 250 330 320 270 /
      calc(250px * var(--vine-scale)) calc(330px * var(--vine-scale)) calc(320px * var(--vine-scale)) calc(270px * var(--vine-scale)) round}
  .vine-frame::after{z-index:2;
    --deco-rail-top:calc(71px * var(--vine-scale));
    --deco-rail-bottom:calc(100% - 88px * var(--vine-scale));
    --deco-top-w:calc(175px * var(--vine-scale));
    --deco-top-w2:calc(140px * var(--vine-scale));
    --deco-top-w3:calc(115px * var(--vine-scale));
    --deco-bottom-w:calc(195px * var(--vine-scale));
    --deco-bottom-w2:calc(156px * var(--vine-scale));
    --deco-bottom-w3:calc(128px * var(--vine-scale));
    --deco-top-f:.26286;--deco-top-f2:.26286;--deco-top-f3:.26286;
    --deco-bottom-g:.25128;--deco-bottom-g2:.25128;--deco-bottom-g3:.25128;
    background:
    var(--deco-top-3,none) var(--deco-top-at3,50%) calc(var(--deco-rail-top) - var(--deco-top-f3) * var(--deco-top-w3)) / var(--deco-top-w3) auto no-repeat,
    var(--deco-top-2,none) var(--deco-top-at2,50%) calc(var(--deco-rail-top) - var(--deco-top-f2) * var(--deco-top-w2)) / var(--deco-top-w2) auto no-repeat,
    var(--deco-top,none) var(--deco-top-at,50%) calc(var(--deco-rail-top) - var(--deco-top-f) * var(--deco-top-w)) / var(--deco-top-w) auto no-repeat,
    var(--deco-bottom-3,none) var(--deco-bottom-at3,50%) calc(var(--deco-rail-bottom) + var(--deco-bottom-g3) * var(--deco-bottom-w3)) / var(--deco-bottom-w3) auto no-repeat,
    var(--deco-bottom-2,none) var(--deco-bottom-at2,50%) calc(var(--deco-rail-bottom) + var(--deco-bottom-g2) * var(--deco-bottom-w2)) / var(--deco-bottom-w2) auto no-repeat,
    var(--deco-bottom,none) var(--deco-bottom-at,50%) calc(var(--deco-rail-bottom) + var(--deco-bottom-g) * var(--deco-bottom-w)) / var(--deco-bottom-w) auto no-repeat,
    var(--deco-left,none) calc(4px * var(--vine-scale)) var(--deco-left-at,50%) / calc(122px * var(--vine-scale)) auto no-repeat,
    var(--deco-right,none) 100% var(--deco-right-at,50%) / calc(132px * var(--vine-scale)) auto no-repeat}
  .vines-1{--deco-top:url("/assets/site/decor/border/deco-top-cross.webp");--deco-top-at:62%;
    --deco-bottom:url("/assets/site/decor/border/deco-bottom-cross.webp");--deco-bottom-at:30%;
    --deco-left:url("/assets/site/decor/border/deco-left-vine.webp");--deco-left-at:55%;
    --deco-right:url("/assets/site/decor/border/deco-right-leaves.webp");--deco-right-at:35%}
  .vines-2{--deco-top:url("/assets/site/decor/border/deco-top-cross.webp");--deco-top-at:25%;
    --deco-bottom:url("/assets/site/decor/border/deco-bottom-cross.webp");--deco-bottom-at:72%;
    --deco-right:url("/assets/site/decor/border/deco-right-vine.webp");--deco-right-at:40%}
  .vines-3{--deco-bottom:url("/assets/site/decor/border/deco-bottom-cross.webp");--deco-bottom-at:55%;
    --deco-left:url("/assets/site/decor/border/deco-left-vine.webp");--deco-left-at:30%;
    --deco-right:url("/assets/site/decor/border/deco-right-leaves.webp");--deco-right-at:65%}
  .vines-4{--deco-top:url("/assets/site/decor/border/deco-top-cross.webp");--deco-top-at:45%;
    --deco-right:url("/assets/site/decor/border/deco-right-leaves.webp");--deco-right-at:50%}
  @container (min-width:560px){
    .vines-1::after{--deco-top-2:url("/assets/site/decor/border/deco-top-cross-down.webp");--deco-top-at2:17%;--deco-top-f2:.24571;
      --deco-bottom-2:url("/assets/site/decor/border/deco-bottom-cross.webp");--deco-bottom-at2:71%}
    .vines-2::after{--deco-top-2:url("/assets/site/decor/border/deco-top-cross.webp");--deco-top-at2:68%;
      --deco-bottom-2:url("/assets/site/decor/border/deco-bottom-cross-up.webp");--deco-bottom-at2:23%;--deco-bottom-g2:.24103}
    .vines-3::after{--deco-bottom-2:url("/assets/site/decor/border/deco-bottom-cross.webp");--deco-bottom-at2:12%}
    .vines-4::after{--deco-top-2:url("/assets/site/decor/border/deco-top-cross-down.webp");--deco-top-at2:83%;--deco-top-f2:.24571}
  }
  @container (min-width:880px){
    .vines-1::after{--deco-top-3:url("/assets/site/decor/border/deco-top-cross.webp");--deco-top-at3:88%}
    .vines-2::after{--deco-bottom-3:url("/assets/site/decor/border/deco-bottom-cross.webp");--deco-bottom-at3:94%}
    .vines-3::after{--deco-top-2:url("/assets/site/decor/border/deco-top-cross.webp");--deco-top-at2:38%;
      --deco-bottom-3:url("/assets/site/decor/border/deco-bottom-cross-up.webp");--deco-bottom-at3:86%;--deco-bottom-g3:.24103}
    .vines-4::after{--deco-top-3:url("/assets/site/decor/border/deco-top-cross.webp");--deco-top-at3:14%}
  }
  @media (max-width:900px){
    .vine-frame{margin-inline:calc(var(--vine-rail-left) + var(--vine-edge) - var(--page-gutter))
      calc(var(--vine-rail-right) + var(--vine-edge) - var(--page-gutter));
      padding:var(--space-3) var(--space-3) var(--space-4)}
  }
  @media (max-width:620px){
    .vine-frame{padding:var(--space-3) var(--space-2) var(--space-3)}
  }
  .quote-wall{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:var(--space-5) var(--space-4);
    margin:0;padding:var(--space-4) 0 var(--space-5)}
  .quote-note{--vine-scale:.2;flex:0 1 var(--breit,320px);margin:0;padding:var(--space-4);
    rotate:var(--dreh,0deg);translate:var(--schub,0px) var(--versatz,0px);transition:rotate .3s ease,translate .3s ease,scale .3s ease;
    background:url("/assets/site/decor/parchment-tile.webp") 0 0/512px repeat;
    -webkit-backdrop-filter:none;backdrop-filter:none;
    box-shadow:inset 0 0 40px color-mix(in srgb,var(--ink) 34%,transparent),0 12px 24px var(--card-solid-dark);
    font:400 16px/1.55 Jost;font-style:italic;color:var(--ink)}
  .quote-note:hover{rotate:0deg;translate:var(--schub,0px) calc(var(--versatz,0px) - 6px);scale:1.04;z-index:3}
  @media (prefers-reduced-motion:reduce){.quote-note{transition:none}}
  .quote-note:nth-child(3n+2){background-position:170px 90px}
  .quote-note:nth-child(3n){background-position:340px 260px}
  .quote-mark{display:block;font:700 34px/0.6 Cinzel;color:var(--ink-muted);margin-bottom:var(--space-1)}
  .quote-note .painted{display:block;width:26px;height:26px;margin:var(--space-2) auto 0;opacity:.7}
  @media (max-width:620px){
    .quote-wall{gap:var(--space-4) var(--space-3)}
    .quote-note{flex:0 0 calc(50% - var(--space-3) / 2);padding:var(--space-3);font-size:13px;line-height:1.45;
      translate:0 calc(var(--versatz,0px) * .5)}
    .quote-note:hover{translate:0 calc(var(--versatz,0px) * .5 - 4px)}
    .quote-note .quote-mark{font-size:24px}
    .quote-note .painted{width:18px;height:18px}
  }
  main:has(>.foliage){position:relative;container-type:inline-size}
  .foliage{position:absolute;inset:0 var(--leaf-bleed);z-index:3;pointer-events:none;overflow:clip;
    --vine-span:calc(316px * var(--foliage-scale));
    --vine-out:calc(var(--vine-span) * .38);
    --corner-overlap:.5}
  .foliage i{position:absolute;filter:brightness(var(--foliage-brightness)) drop-shadow(var(--foliage-shadow))}
  :root{
    --hang-l:url("/assets/site/decor/foliage/cluster-top-left.webp");
    --hang-r:url("/assets/site/decor/foliage/cluster-top-right.webp");
    --rise-l:url("/assets/site/decor/foliage/cluster-bottom-left.webp");
    --rise-r:url("/assets/site/decor/foliage/cluster-bottom-right.webp")}
  .vine-left,.vine-right{top:0;bottom:0;width:var(--vine-span);
    --cw:var(--foliage-cluster-scale);
    --join-1:calc(var(--foliage-period) * (1 - var(--join-shift)));
    --join-2:calc(var(--foliage-period) * (2 - var(--join-shift)));
    --join-3:calc(var(--foliage-period) * (3 - var(--join-shift)));
    --join-4:calc(var(--foliage-period) * (4 - var(--join-shift)));
    --join-5:calc(var(--foliage-period) * (5 - var(--join-shift)));
    --join-6:calc(var(--foliage-period) * (6 - var(--join-shift)));
    background:
      var(--rise) var(--edge) 0 top calc(var(--join-1) - var(--rise-height) * var(--cw) * 1.1 * .75) / calc(var(--rise-width) * var(--cw) * 1.1) auto no-repeat,
      var(--hang) var(--edge) calc(var(--foliage-reach) * .8) top calc(var(--join-2) - var(--hang-height) * var(--cw) * .8 * .2) / calc(var(--hang-width) * var(--cw) * .8) auto no-repeat,
      var(--rise) var(--edge) calc(var(--foliage-reach) * .3) top calc(var(--join-3) - var(--rise-height) * var(--cw) * .95 * .75) / calc(var(--rise-width) * var(--cw) * .95) auto no-repeat,
      var(--hang) var(--edge) 0 top calc(var(--join-4) - var(--hang-height) * var(--cw) * 1.15 * .2) / calc(var(--hang-width) * var(--cw) * 1.15) auto no-repeat,
      var(--rise) var(--edge) calc(var(--foliage-reach) * .6) top calc(var(--join-5) - var(--rise-height) * var(--cw) * .85 * .75) / calc(var(--rise-width) * var(--cw) * .85) auto no-repeat,
      var(--hang) var(--edge) 0 top calc(var(--join-6) - var(--hang-height) * var(--cw) * 1 * .2) / calc(var(--hang-width) * var(--cw) * 1) auto no-repeat,
      var(--vine) var(--edge) 0 top calc(var(--foliage-period) * var(--join-shift) * -1) / calc(var(--vine-width) * var(--foliage-scale)) auto repeat-y}
  .vine-left{--edge:right;left:var(--leaf-edge);--join-shift:0;
    --vine:url("/assets/site/decor/foliage/vine-left.webp");--vine-width:316px;
    --hang:var(--hang-l);--hang-width:370px;--hang-height:783px;
    --rise:var(--rise-l);--rise-width:423px;--rise-height:782px}
  .vine-right{--edge:left;right:var(--leaf-edge);--join-shift:.5;
    --vine:url("/assets/site/decor/foliage/vine-right.webp");--vine-width:277px;
    --hang:var(--hang-r);--hang-width:351px;--hang-height:748px;
    --rise:var(--rise-r);--rise-width:376px;--rise-height:778px}
  .corner{--k:calc(var(--foliage-cluster-scale) * var(--corner-size));width:calc(var(--w) * var(--k));height:calc(var(--h) * var(--k));
    bottom:0;background:var(--img) 0 0/100% 100% no-repeat}
  .corner-left{--img:var(--rise-l);--w:423px;--h:782px;
    left:var(--leaf-edge)}
  .corner-right{--img:var(--rise-r);--w:376px;--h:778px;
    right:var(--leaf-edge)}
  main:has(>.foliage) .page-head::before,main:has(>.foliage) .page-head::after{content:"";position:absolute;z-index:1;top:0;pointer-events:none;
    --k:calc(var(--foliage-cluster-scale) * var(--corner-size));height:calc(var(--h) * var(--k));
    width:calc(var(--vine-out) + var(--vine-span) + var(--corner-in));
    background:var(--img) var(--edge) 0 top 0 / calc(var(--w) * var(--k)) auto no-repeat;
    filter:brightness(var(--foliage-brightness)) drop-shadow(var(--foliage-shadow))}
  main:has(>.foliage) .page-head::before{--img:var(--hang-l);--w:370px;--h:783px;--edge:right;
    left:var(--leaf-edge)}
  main:has(>.foliage) .page-head::after{--img:var(--hang-r);--w:351px;--h:748px;--edge:left;
    right:var(--leaf-edge)}
  .bushes{position:relative}
  .bushes::before,.bushes::after{content:"";position:absolute;z-index:-1;pointer-events:none;
    --k:var(--bush-scale);top:calc(var(--h) * var(--k) * var(--bush-lift) * -1);height:calc(var(--h) * var(--k));
    width:calc(var(--vine-out) + var(--vine-span) + var(--bush-in));
    background:var(--img) var(--edge) 0 top 0 / calc(var(--w) * var(--k)) auto no-repeat;
    filter:brightness(calc(var(--foliage-brightness) * var(--bush-tone))) drop-shadow(var(--foliage-shadow))}
  .bushes::before{--img:var(--hang-l);--w:370px;--h:783px;--edge:right;
    left:var(--leaf-edge)}
  .bushes::after{--img:var(--hang-r);--w:351px;--h:748px;--edge:left;
    right:var(--leaf-edge)}
  .bushes.rise::before{--img:var(--rise-l);--w:423px;--h:782px}
  .bushes.rise::after{--img:var(--rise-r);--w:376px;--h:778px}
  @media (max-width:900px){:root{--foliage-scale:.4;--foliage-cluster-scale:.3;--foliage-reach:12px;
    --corner-in:40px;--bush-scale:.4;--bush-in:60px}}
  @media (max-width:620px){:root{--foliage-reach:0px}
    .foliage,.bushes::before,.bushes::after,main:has(>.foliage) .page-head::before,main:has(>.foliage) .page-head::after{display:none}}
  .site-footer{position:relative;z-index:1;display:flex;align-items:center;gap:var(--space-5);
    padding:var(--space-2) var(--page-gutter);
    background:var(--footer-mid);
    box-shadow:0 -22px 44px rgba(0,0,0,.85),0 -6px 14px rgba(0,0,0,.6)}
  .site-footer::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;pointer-events:none;
    background:linear-gradient(90deg,transparent,var(--old-gold) 25%,var(--old-gold) 75%,transparent)}
  .site-footer .brand img{height:28px}
  .site-footer .brand span{font-size:17px}
  .site-footer small{color:var(--text-muted);font-size:13px}
  .site-footer nav{margin-left:auto;display:flex;gap:var(--space-4);font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
  .site-footer nav a:hover{color:var(--heading)}
  @media (max-width:900px){
    .site-footer{flex-wrap:wrap;justify-content:center;text-align:center;gap:var(--space-1) var(--space-4);
      padding:var(--space-3) var(--page-gutter)}
    .site-footer nav{margin-left:0;flex-basis:100%;flex-wrap:wrap;justify-content:center;gap:var(--space-3)}
  }
  .light-frame{position:absolute;inset:0;overflow:hidden;container-type:size;pointer-events:none;mix-blend-mode:screen}
  .light{position:absolute;left:var(--light-x,50%);top:var(--light-y,50%);
    translate:calc(var(--light-x,50%) * -1) calc(var(--light-y,50%) * -1);
    width:max(100cqw,100cqh * var(--light-w) / var(--light-h));
    height:max(100cqh,100cqw * var(--light-h) / var(--light-w))}
  .light::before{content:"";position:absolute;inset:0;
    background:radial-gradient(circle at var(--sun-x) var(--sun-y),var(--sun-glow),transparent 20%);
    animation:sun-glow-breathe var(--sun-glow-period) ease-in-out infinite alternate}
  @keyframes sun-glow-breathe{from{opacity:.55}to{opacity:1}}
  .rays{position:absolute;inset:0}
  .rays i{position:absolute;inset:0;opacity:0;will-change:opacity,transform;
    transform-origin:var(--ray-x) var(--ray-y);
    background:conic-gradient(from calc(var(--angle) - var(--width) / 2) at var(--ray-x) var(--ray-y),
      transparent 0deg,
      color-mix(in srgb,var(--color) 8%,transparent) calc(var(--width) * .15),
      color-mix(in srgb,var(--color) 35%,transparent) calc(var(--width) * .3),
      var(--color) calc(var(--width) * .5),
      color-mix(in srgb,var(--color) 35%,transparent) calc(var(--width) * .7),
      color-mix(in srgb,var(--color) 8%,transparent) calc(var(--width) * .85),
      transparent var(--width));
    animation:ray-cycle var(--duration) ease-in-out var(--delay) infinite}
  .rays-long i{animation-name:ray-sweep;animation-timing-function:linear}
  @keyframes ray-sweep{
    0%  {opacity:0;transform:rotate(calc(var(--drift) * -1))}
    20% {opacity:var(--strength)}
    70% {opacity:var(--strength)}
    90% {opacity:0;transform:rotate(calc(var(--drift) * .8))}
    100%{opacity:0;transform:rotate(var(--drift))}}
  @keyframes ray-cycle{
    0%  {opacity:0;transform:rotate(calc(var(--drift) * -1))}
    30% {opacity:var(--strength)}
    55% {opacity:var(--strength)}
    80% {opacity:0;transform:rotate(var(--drift))}
    100%{opacity:0;transform:rotate(var(--drift))}}
  .light-frame.is-offscreen :is(.rays i,.light::before){animation-play-state:paused}
  @media (prefers-reduced-motion:reduce),(pointer:coarse){
    .rays i,.light::before{animation:none}
    .rays i:nth-child(odd){opacity:var(--strength)}}
  .fireflies{position:absolute;inset:0;overflow:hidden;pointer-events:none}
  .fireflies i{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);
    margin:calc(var(--size) / -2);border-radius:50%;opacity:0;will-change:transform,opacity;
    background:radial-gradient(circle,var(--firefly-core) 0 22%,var(--firefly-glow) 42%,transparent 72%);
    box-shadow:0 0 calc(var(--size) * 1.4) calc(var(--size) * .25) var(--firefly-halo);
    filter:blur(var(--blur));
    animation:firefly-float var(--float-time) ease-in-out var(--delay) infinite alternate,
              firefly-flicker var(--flicker-time) ease-in-out var(--delay) infinite}
  @keyframes firefly-float{
    0%  {transform:translate(0,0)}
    33% {transform:translate(var(--x1),var(--y1))}
    66% {transform:translate(var(--x2),var(--y2))}
    100%{transform:translate(var(--x3),var(--y3))}}
  @keyframes firefly-flicker{
    0%,100%{opacity:0}
    20%{opacity:var(--peak)}
    50%{opacity:calc(var(--peak) * .35)}
    75%{opacity:var(--peak)}}
  .fireflies.is-offscreen i{animation-play-state:paused}
  @media (prefers-reduced-motion:reduce){
    .fireflies i{animation:none;opacity:calc(var(--peak) * .6)}}
  @media (pointer:coarse){.fireflies{display:none}}
  .art-frame{position:absolute;inset:0;overflow:hidden;container-type:size;pointer-events:none}
  .art-stage{position:absolute;left:var(--art-x,50%);top:var(--art-y,50%);
    translate:calc(var(--art-x,50%) * -1) calc(var(--art-y,50%) * -1);
    width:max(100cqw,100cqh * var(--art-w) / var(--art-h));
    height:max(100cqh,100cqw * var(--art-h) / var(--art-w))}
  @media (prefers-reduced-motion:reduce){.art-frame{display:none}}
  @supports (animation-timeline: view()){
    @keyframes parallax-fore{from{transform:translateY(calc(var(--travel) / 2))}to{transform:translateY(calc(var(--travel) / -2))}}
    @keyframes parallax-back{from{transform:translateY(calc(var(--travel) / -2))}to{transform:translateY(calc(var(--travel) / 2))}}
  }
  @supports (animation-timeline: scroll()){
    @keyframes content-lag{from{transform:translateY(0)}to{transform:translateY(var(--content-lag))}}
    .page-body{animation:content-lag linear both;animation-timeline:scroll()}
  }
  @supports not (animation-timeline: scroll()){
    .page-body{transform:translateY(calc(var(--scroll-p,0) * var(--content-lag)))}
  }
  @media (prefers-reduced-motion:reduce),(pointer:coarse){
    .page-body{animation:none;transform:none}
  }
  .js .reveal{opacity:0;translate:0 var(--reveal-shift);
    transition:opacity var(--reveal-time) ease-out var(--reveal-delay,0s),translate var(--reveal-time) var(--reveal-ease) var(--reveal-delay,0s)}
  .js .reveal.is-visible{opacity:1;translate:none}
  .js .reveal.is-instant{transition:none}
  @media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;translate:none;transition:none}}
  body.special{background:none}
  body.special::before,body.special::after{content:"";position:fixed;z-index:-1;pointer-events:none}
  body.special::before{inset:calc(var(--vine-blur) * -3);
    background:var(--ground-texture) 0 0/var(--ground-tile) repeat;
    filter:blur(var(--vine-blur)) brightness(var(--ground-brightness))}
  body.special::after{inset:0;background:var(--vine-fill)}
  .special-bar{position:absolute;z-index:5;top:0;left:0;right:0;display:flex;align-items:center;
    justify-content:space-between;gap:var(--space-3);padding:var(--space-4) var(--page-gutter)}
  .special-bar .login{height:var(--header-login-height);padding:0 var(--space-4);gap:var(--space-2);font-size:var(--header-login-size)}
  .special-back{--button-pad-x:var(--space-5);padding-left:calc(var(--space-5) + var(--space-3))}
  .special-back .arrow{right:auto;left:var(--button-arrow-right)}
  .special-back:hover .arrow,.special-back:focus-visible .arrow{translate:-3px -54%}
  .special-page{--special-top:calc(var(--button-height) + var(--space-4) * 2 + var(--space-3));
    position:relative;isolation:isolate;min-height:var(--view-height);
    padding:var(--special-top) var(--page-gutter) var(--space-6)}
  @media (max-width:620px){
    .special-bar{padding:var(--space-3) var(--page-gutter)}
    .special-back{--button-pad-x:var(--space-3);padding-left:calc(var(--space-3) + var(--space-3))}
    .special-back-word,.special-bar .account-greeting{display:none}
    .special-page{--special-top:calc(var(--button-height) + var(--space-3) * 3)}
  }
  .defs{position:absolute;width:0;height:0}
  .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .stagger>.reveal:nth-of-type(2){--reveal-delay:.12s}
  .stagger>.reveal:nth-of-type(3){--reveal-delay:.24s}
  .stagger>.reveal:nth-of-type(4){--reveal-delay:.36s}
  .stagger>.reveal:nth-of-type(5){--reveal-delay:.48s}
  .page-title{--reveal-delay:.15s}
  .icon-scroll{--icon:var(--flat-scroll)}
  .icon-calendar{--icon:var(--flat-calendar)}
  .icon-community{--icon:var(--flat-community)}
  .icon-guild{--icon:var(--flat-guild)}
  .icon-megaphone{--icon:var(--flat-megaphone)}
  .icon-leaf{--icon:var(--flat-leaf)}
}
@property --parallax-subject{syntax:"*";inherits:false}