const CornerOrnament=({className="corner tl"})=><svg className={className}viewBox="0 0 44 44"fill="none"stroke="var(--silver)"strokeWidth=".7">
    {}
    <path d="M 0 0 L 44 0"opacity=".9"/>
    <path d="M 0 0 L 0 44"opacity=".9"/>
    <path d="M 3 3 L 24 3"opacity=".6"/>
    <path d="M 3 3 L 3 24"opacity=".6"/>
    {}
    <path d="M 3 14 Q 8 14 8 9 Q 8 4 13 4"/>
    {}
    <circle cx="8"cy="9"r="0.9"fill="var(--silver)"stroke="none"/>
    {}
    <path d="M 14 0 Q 14 6 20 6"opacity=".5"/>
    <path d="M 0 14 Q 6 14 6 20"opacity=".5"/>
  </svg>;const DividerOrnament=()=><svg width="100"height="14"viewBox="0 0 100 14"fill="none"className="ornament">
    {}
    <path d="M 50 1 L 54 7 L 50 13 L 46 7 Z"/>
    <circle cx="50"cy="7"r="1.2"className="fill"/>
    {}
    <path d="M 30 7 L 33 7 M 31.5 5.5 L 31.5 8.5"strokeWidth=".5"/>
    <path d="M 67 7 L 70 7 M 68.5 5.5 L 68.5 8.5"strokeWidth=".5"/>
    {}
    <path d="M 38 7 Q 41 7 42 5 Q 43 7 45 7"strokeWidth=".5"/>
    <path d="M 55 7 Q 57 7 58 5 Q 59 7 62 7"strokeWidth=".5"/>
  </svg>;const StarGlyph=({size=14})=><svg width={size}height={size}viewBox="0 0 14 14"className="ornament">
    <path d="M 7 0 L 7.6 6.4 L 14 7 L 7.6 7.6 L 7 14 L 6.4 7.6 L 0 7 L 6.4 6.4 Z"className="fill"/>
  </svg>;const SunBanner=({label="VII \xB7 IX \xB7 MMXXVI"})=><svg width="260"height="60"viewBox="0 0 260 60"fill="none"stroke="var(--silver)"strokeWidth=".7"style={{display:"block",margin:"0 auto"}}>
    {}
    <rect x="40"y="14"width="180"height="32"/>
    <rect x="44"y="18"width="172"height="24"opacity=".5"/>
    {}
    <path d="M 40 14 Q 30 14 30 24 Q 30 30 24 30"/>
    <path d="M 40 46 Q 30 46 30 36 Q 30 30 24 30"/>
    <path d="M 220 14 Q 230 14 230 24 Q 230 30 236 30"/>
    <path d="M 220 46 Q 230 46 230 36 Q 230 30 236 30"/>
    {}
    <g transform="translate(130 30)"opacity=".9">
      <circle r="3.6"fill="var(--silver)"stroke="none"/>
      {Array.from({length:12}).map((_,i)=>{const a=i*30*Math.PI/180;const r1=5.5,r2=i%2===0?9.5:7.5;return<line key={i}x1={Math.cos(a)*r1}y1={Math.sin(a)*r1}x2={Math.cos(a)*r2}y2={Math.sin(a)*r2}/>})}
    </g>
    {}
    <text x="130"y="56"textAnchor="middle"fill="var(--ink-dim)"stroke="none"style={{font:'400 8px "Cinzel", serif',letterSpacing:"0.28em"}}>{label}</text>
    {}
    <path d="M 14 30 l 0 -3 m 0 6 l 0 -3 m -3 0 l 6 0"/>
    <circle cx="14"cy="30"r="0.8"fill="var(--silver)"stroke="none"/>
    <path d="M 246 30 l 0 -3 m 0 6 l 0 -3 m -3 0 l 6 0"/>
    <circle cx="246"cy="30"r="0.8"fill="var(--silver)"stroke="none"/>
  </svg>;const ConstellationGlyph=({type=0,size=56})=>{const sets=[{pts:[[4,12],[14,4],[24,12],[34,4],[44,12]],lines:[[0,1],[1,2],[2,3],[3,4]]},{pts:[[10,4],[44,10],[20,22]],lines:[[0,1],[1,2],[2,0]]},{pts:[[4,14],[12,16],[20,14],[28,12],[34,4],[42,10],[40,18]],lines:[[0,1],[1,2],[2,3],[3,4],[3,5],[5,6]]},{pts:[[4,14],[16,12],[28,14],[40,8],[44,4]],lines:[[0,1],[1,2],[2,3],[3,4]]},{pts:[[16,8],[32,14]],lines:[[0,1]]}];const s=sets[type%sets.length];const w=48,h=24;return<svg width={size}height={size*h/w}viewBox={`0 0 ${w} ${h}`}fill="none">
      {s.lines.map(([a,b],i)=><line key={i}x1={s.pts[a][0]}y1={s.pts[a][1]}x2={s.pts[b][0]}y2={s.pts[b][1]}stroke="var(--silver)"strokeWidth=".4"opacity=".5"/>)}
      {s.pts.map(([x,y],i)=><circle key={i}cx={x}cy={y}r="0.9"fill="#fff"style={{filter:"drop-shadow(0 0 2px rgba(255,255,255,.8))"}}/>)}
    </svg>};Object.assign(window,{CornerOrnament,DividerOrnament,StarGlyph,SunBanner,ConstellationGlyph});
