/* shared.css - fekett.neocities.org */

/* === SECTION SEPARATOR === */
/* Drop <div class="p5-sep"></div> between page sections for the dashed red rule */
.p5-sep {
  height: 3px;
  pointer-events: none;
  background: repeating-linear-gradient(
    90deg,
    rgba(211,47,47,.6) 0, rgba(211,47,47,.6) 10px,
    transparent 10px, transparent 20px
  );
}

/* === NAV OVERLAY === */
#p5Nav {
  display: none;
  position: fixed; inset: 0; z-index: 9850;
  overflow: hidden;
  opacity: 0;
  transition: opacity .15s ease 0s;
}

/* background lives on ::before so it can fade in with nav items */
#p5Nav::before {
  content: '';
  position: absolute; inset: 0;
  background-image: repeating-linear-gradient(
    -45deg,
    #d32f2f 0px,  #d32f2f 40px,
    #0d0d0d 40px, #0d0d0d 80px
  );
  background-size: 113px 113px;
  animation: navStripe 8s linear infinite;
  opacity: 0;
  transition: opacity .3s ease .8s;
}
#p5Nav.nopen::before { opacity: 1; }
#p5Nav.nclosing::before { opacity: 0 !important; transition: opacity .1s ease 0s !important; }

/* nav itself starts invisible, fades in immediately so borders can draw */
#p5Nav.nopen { opacity: 1; }
#p5Nav.nclosing { opacity: 0 !important; transition: opacity .1s ease .1s !important; }

@keyframes navStripe {
  from { background-position: 0 0; }
  to   { background-position: 113px 113px; }
}

/* 4 border lines drawn sequentially */
.nb { position:absolute; background:#d32f2f; z-index:2; }
.nb-t { top:0; left:0; height:12px; width:0; }
.nb-r { top:0; right:0; width:12px; height:0; }
.nb-b { bottom:0; right:0; height:12px; width:0; }
.nb-l { bottom:0; left:0; width:12px; height:0; }

#p5Nav.nopen .nb-t { animation: drawW .2s cubic-bezier(.19,1,.22,1) .00s both; }
#p5Nav.nopen .nb-r { animation: drawH .2s cubic-bezier(.19,1,.22,1) .20s both; }
#p5Nav.nopen .nb-b { animation: drawW .2s cubic-bezier(.19,1,.22,1) .40s both; }
#p5Nav.nopen .nb-l { animation: drawH .2s cubic-bezier(.19,1,.22,1) .60s both; }
@keyframes drawW { from{width:0}  to{width:100%}  }
@keyframes drawH { from{height:0} to{height:100%} }

/* keep borders visible once drawn */
#p5Nav.nopen .nb-t, #p5Nav.nopen .nb-b { width:100%; }
#p5Nav.nopen .nb-r, #p5Nav.nopen .nb-l { height:100%; }

/* nav close overlay (JS-driven wipe) */
#navCloseOverlay {
  position: fixed; top:0; left:-100%; width:100%; height:100%;
  z-index: 9999; background: #d32f2f;
  pointer-events: none;
  will-change: left;
}

/* hide header while nav open */
body.nav-open > header,
body.nav-open > nav.fixed.top-0 { opacity:0 !important; pointer-events:none !important; }
body > header { transition: opacity .2s; }

/* nav inner content — semi-transparent so stripe shows through */
#p5Nav .nc {
  position:absolute; inset:12px;
  display:flex; align-items:center;
  opacity:0; transition: opacity .3s ease .8s;
  background: rgba(0,0,0,.62);
}
#p5Nav.nopen .nc { opacity:1; }

/* closing */
#p5Nav.nclosing .nc   { opacity:0 !important; transition:opacity .1s ease 0s !important; }
#p5Nav.nclosing       { opacity:0; transition:opacity .1s ease .1s !important; }
#p5Nav.nclosing .nb-t { animation: unDrawW .2s cubic-bezier(.77,0,.18,1) .20s both; }
#p5Nav.nclosing .nb-r { animation: unDrawH .2s cubic-bezier(.77,0,.18,1) .10s both; }
#p5Nav.nclosing .nb-b { animation: unDrawW .2s cubic-bezier(.77,0,.18,1) .10s both; }
#p5Nav.nclosing .nb-l { animation: unDrawH .2s cubic-bezier(.77,0,.18,1) 0s   both; }
@keyframes unDrawW { from{width:100%}  to{width:0}  }
@keyframes unDrawH { from{height:100%} to{height:0} }
@keyframes sqDown   { from{transform:skewX(-12deg) translateY(0);opacity:1;} to{transform:skewX(-12deg) translateY(80px);opacity:0;} }

/* close btn */
.nclosebtn {
  position:absolute; top:16px; right:16px;
  font-family:'Space Grotesk',sans-serif; font-weight:900; font-style:italic;
  font-size:12px; letter-spacing:.28em; color:#fff; text-transform:uppercase;
  border:4px solid rgba(255,255,255,.3); padding:6px 18px;
  background:transparent; cursor:pointer; z-index:10;
  transition:background .15s, border-color .15s;
}
.nclosebtn:hover { background:#d32f2f; border-color:#d32f2f; }

/* big page number — right side */
#navPgNum {
  position:absolute; right:4%; top:50%; transform:translateY(-50%);
  font-family:'Space Grotesk',sans-serif; font-weight:900; font-style:italic;
  font-size:clamp(180px,28vw,340px);
  color:#fff;
  text-shadow: 4px 4px 0 #000, 8px 8px 0 rgba(0,0,0,.6);
  pointer-events:none; user-select:none; line-height:1;
  transition:color .12s;
  width:52%; text-align:right;
}

/* nav items */
.nitems {
  display:flex; flex-direction:column; align-items:flex-start;
  gap:4px; padding-left:6%; position:relative; z-index:5; width:55%;
}
.p5nitem {
  display:block;
  font-family:'Space Grotesk',sans-serif; font-weight:900; font-style:italic;
  font-size:clamp(36px,5.5vw,72px);
  line-height:.92; letter-spacing:-1px; text-transform:uppercase;
  color:#d32f2f; text-decoration:none;
  padding:6px 0; transition:color .08s ease;
  opacity:0; transform:translateX(-24px);
}
.p5nitem.nactive { color:#fff; }
#p5Nav.nopen .p5nitem:nth-child(1){opacity:1;transform:none;transition:color .08s,transform .35s cubic-bezier(.19,1,.22,1) .78s,opacity .3s ease .78s;}
#p5Nav.nopen .p5nitem:nth-child(2){opacity:1;transform:none;transition:color .08s,transform .35s cubic-bezier(.19,1,.22,1) .85s,opacity .3s ease .85s;}
#p5Nav.nopen .p5nitem:nth-child(3){opacity:1;transform:none;transition:color .08s,transform .35s cubic-bezier(.19,1,.22,1) .92s,opacity .3s ease .92s;}
#p5Nav.nopen .p5nitem:nth-child(4){opacity:1;transform:none;transition:color .08s,transform .35s cubic-bezier(.19,1,.22,1) .99s,opacity .3s ease .99s;}
#p5Nav.nopen .p5nitem:nth-child(5){opacity:1;transform:none;transition:color .08s,transform .35s cubic-bezier(.19,1,.22,1) 1.06s,opacity .3s ease 1.06s;}

/* selector triangle */
#navSel {
  position:absolute; left:6%; top:0;
  width:310px; height:88px; pointer-events:none; z-index:0;
  transition:top .15s cubic-bezier(.19,1,.22,1), height .15s cubic-bezier(.19,1,.22,1), width .15s cubic-bezier(.19,1,.22,1);
}
.nsel-r { fill:#d32f2f; }
.nsel-c { fill:#00e5ff; mix-blend-mode:screen; opacity:0.92; }
.nsel-w { display:none; }

/* 3 decorative squares */
.nsqs { position:absolute; bottom:32px; right:32px; display:flex; gap:12px; align-items:flex-end; }
.nsq  { width:44px; height:44px; transform:skewX(-12deg) translateY(80px); opacity:0; }
.nsq1 { background:#fff; }
.nsq2 { background:#d32f2f; }
.nsq3 { background:#fff; }
#p5Nav.nopen .nsq1{animation:sqUp .4s cubic-bezier(.34,1.56,.64,1) .85s forwards;}
#p5Nav.nopen .nsq2{animation:sqUp .4s cubic-bezier(.34,1.56,.64,1) .95s forwards;}
#p5Nav.nopen .nsq3{animation:sqUp .4s cubic-bezier(.34,1.56,.64,1) 1.05s forwards;}
@keyframes sqUp { to{transform:skewX(-12deg) translateY(0);opacity:1;} }

@media(max-width:768px){
  #navPgNum { font-size:clamp(100px,22vw,180px); }
  .p5nitem  { font-size:clamp(28px,8vw,52px); }
}

@media(max-width:480px){
  /* hide the big ghost number — takes up too much room */
  #navPgNum { display:none; }
  /* items go full width */
  .nitems { width:90%; padding-left:8%; }
  .p5nitem { font-size:clamp(36px,11vw,56px); }
  /* squares move to bottom-left so they don't fight the close btn */
  .nsqs { right:auto; left:24px; bottom:24px; }
  /* console full width on mobile */
  #p5Con { width:100%; border-right:none; }
  /* HUD tighter to corner on small screens */
  #p5Hud { width: clamp(110px, 38vw, 160px) !important; }
}
.ws { position:fixed; pointer-events:none; z-index:9799; transform-origin:center center; }
.ws1 {
  background:#131313; width:220%; height:60px; top:22%; left:-60%;
  transform: rotate(-6deg) translateY(120vh);
  transition: transform 1.0s cubic-bezier(.77,0,.175,1) .03s;
}
.ws2 {
  background:#e5e2e1; width:180%; height:48px; top:55%; left:-40%;
  transform: rotate(-22deg) translateY(120vh);
  transition: transform .95s cubic-bezier(.77,0,.175,1) .10s;
}
.ws3 {
  background:#131313; width:140%; height:54px; top:75%; left:-20%;
  transform: rotate(-11deg) translateY(120vh);
  transition: transform 1.05s cubic-bezier(.77,0,.175,1) .17s;
}
#waveOverlay.active .ws1 { transform: rotate(-6deg)  translateY(0); }
#waveOverlay.active .ws2 { transform: rotate(-22deg) translateY(0); }
#waveOverlay.active .ws3 { transform: rotate(-11deg) translateY(0); }


/* === WAVE BLOBS === */
#moonEl::after {
  content:''; position:absolute; inset:0; border-radius:50%;
  background:#131313; clip-path:var(--moon-clip, inset(0 50% 0 0));
}
.ww {
  position:absolute; width:300%; height:300%; left:-100%; top:220%;
  border-radius:45% 40% 50% 40% / 40% 50% 40% 45%;
  --sw:5deg;
  animation:wSwell 8s ease-in-out infinite alternate;
  transition:top 1.1s cubic-bezier(.77,0,.175,1);
}
@keyframes wSwell {
  from { transform:rotate(calc(var(--sw)*-1)); }
  to   { transform:rotate(var(--sw)); }
}
.ww1 { background:#0d0d0d; z-index:10; transition-delay:.15s; transition-duration:1.1s; }
.ww2 { background:#93000a; z-index:20; opacity:.95; transition-delay:.07s; transition-duration:1s; }
.ww3 { background:#d32f2f; z-index:30; box-shadow:0 -10px 80px rgba(211,47,47,.7); transition-delay:0s; transition-duration:.9s; }
#waveOverlay.active .ww1 { top:-70%; transition-delay:0s;   transition-duration:.75s; }
#waveOverlay.active .ww2 { top:-55%; transition-delay:.07s; transition-duration:.85s; }
#waveOverlay.active .ww3 { top:-40%; transition-delay:.14s; transition-duration:1s;   }


/* === CONSOLE === */
.con-open { transform:translateY(0) !important; }
.log-ln {
  font-family:'Space Grotesk',sans-serif; font-weight:300; font-size:12px;
  line-height:1.65; color:rgba(229,226,225,.45);
  white-space:pre-wrap; word-break:break-word;
  opacity:0; animation:lgSl .22s forwards;
}
.log-ln.err { color:rgba(211,47,47,.9); }
.log-ln.inf { color:rgba(229,226,225,.65); }
.log-ln.cmd { color:rgba(255,255,255,.8); }
@keyframes lgSl {
  from { transform:translateY(4px); opacity:0; }
  to   { transform:translateY(0);   opacity:1; }
}
@keyframes cdp {
  0%,100% { opacity:1; }
  50%      { opacity:.2; }
}
@media(max-width:768px) { #p5Con { width:100%; border-right:none; } }


/* === CUSTOM CURSOR === */
/* hide default cursor sitewide, show custom via JS-driven element */
* { cursor: none !important; }

#p5Cursor {
  position: fixed;
  width: 12px; height: 12px;
  background: #00e5ff;
  transform: translate(-50%,-50%) skewX(-15deg) rotate(45deg);
  pointer-events: none;
  z-index: 99999;
  transition: transform .08s, background .08s;
}
#p5Cursor.clicking {
  transform: translate(-50%,-50%) skewX(-15deg) rotate(45deg) scale(.7);
  background: #fff;
}
/* restore cursor on touch devices */
@media(hover:none){
  * { cursor: auto !important; }
  #p5Cursor { display:none; }
}

/* === SCROLLBAR === */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #0d0d0d; }
::-webkit-scrollbar-thumb { background: #d32f2f; }
::-webkit-scrollbar-thumb:hover { background: #ff5252; }
* { scrollbar-width: thin; scrollbar-color: #d32f2f #0d0d0d; }

/* === SHARED HEADER === */
/* Used by all pages — defined here so it only needs to exist once */
/* === MARKIN FONT === */
@font-face {
  font-family: 'Markin';
  src: url('/fonts/p5hatty-1.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

#siteHeader {
  position:fixed; top:0; left:0; right:0; z-index:300;
  display:flex; justify-content:flex-end; align-items:center;
  padding:10px 32px;
  background:transparent;
  transition: opacity .2s;
}
body.nav-open #siteHeader { opacity:0; pointer-events:none; }

@media(max-width:480px){
  #siteHeader { padding:8px 16px; }
}

/* === P5 NAV TRIGGER BUTTON === */
/* Authentic Persona 5 parallelogram menu button */
#p5NavBtn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #d32f2f;
  border: none;
  cursor: pointer;
  padding: 8px 22px 8px 18px;
  clip-path: polygon(10px 0%, 100% 0%, calc(100% - 10px) 100%, 0% 100%);
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 900;
  font-style: italic;
  font-size: 11px;
  letter-spacing: .28em;
  color: #fff;
  text-transform: uppercase;
  transition: background .1s;
  overflow: hidden;
}
#p5NavBtn::before {
  /* scan-line sweep on hover — authentic P5 menu highlight */
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    105deg,
    transparent 30%,
    rgba(255,255,255,.18) 50%,
    transparent 70%
  );
  transform: translateX(-100%);
  transition: transform 0s;
}
#p5NavBtn:hover { background: #ff1744; }
#p5NavBtn:hover::before {
  transform: translateX(200%);
  transition: transform .4s ease;
}
#p5NavBtn:active { background: #b71c1c; }

/* The three stacked bars icon inside the button — P5 style */
#p5NavBtn .nb-icon {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex-shrink: 0;
}
#p5NavBtn .nb-icon span {
  display: block;
  height: 2px;
  background: #fff;
  transition: width .15s;
}
#p5NavBtn .nb-icon span:nth-child(1) { width: 14px; }
#p5NavBtn .nb-icon span:nth-child(2) { width: 10px; }
#p5NavBtn .nb-icon span:nth-child(3) { width: 14px; }
#p5NavBtn:hover .nb-icon span:nth-child(2) { width: 14px; }

/* small cyan accent square — P5's signature glitch accent */
#p5NavBtn::after {
  content: '';
  position: absolute;
  right: -4px; top: -4px;
  width: 8px; height: 8px;
  background: #00e5ff;
  transform: skewX(-12deg);
  opacity: 0;
  transition: opacity .1s;
}
#p5NavBtn:hover::after { opacity: 1; }

/* === P5 CONSOLE TAB — enhanced === */
/* Angled tab label with proper P5 status-screen typography */
#p5ConTab {
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 14px 0 0;
  cursor: pointer;
  background: #d32f2f;
  user-select: none;
  position: relative;
  overflow: hidden;
}
/* diagonal accent stripe across the tab — P5 card header style */
#p5ConTab::before {
  content: '';
  position: absolute;
  left: 0; top: 0;
  width: 34px; height: 100%;
  background: rgba(0,0,0,.25);
  clip-path: polygon(0 0, 24px 0, 34px 100%, 0 100%);
}
#p5ConTab::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(105deg, transparent 40%, rgba(255,255,255,.07) 55%, transparent 70%);
  animation: tabSheen 6s ease-in-out infinite;
}
@keyframes tabSheen {
  0%,70%,100% { opacity: 0; }
  75%          { opacity: 1; transform: translateX(-60%); }
  85%          { opacity: 1; transform: translateX(200%); }
  86%          { opacity: 0; }
}
#p5ConTab .tab-label {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-left: 40px; /* clear the diagonal stripe */
  position: relative;
  z-index: 1;
}
#p5ConTab .tab-chevron {
  font-size: 9px;
  color: rgba(255,255,255,.5);
  position: relative;
  z-index: 1;
  transition: transform .3s cubic-bezier(.19,1,.22,1);
}
.con-open #p5ConTab .tab-chevron { transform: rotate(180deg); }

/* === P5 SECTION DIVIDER — reusable === */
/* The angled red rule used between major page sections */
.p5-rule {
  height: 5px;
  background: #d32f2f;
  clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 8px 100%);
  box-shadow: 3px 3px 0 rgba(229,226,225,.12);
}

/* === P5 STATUS BADGE — reusable === */
/* Small angled label tag, like the confidant rank badges */
.p5-badge {
  display: inline-flex;
  align-items: center;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 900;
  font-style: italic;
  font-size: 10px;
  letter-spacing: .22em;
  text-transform: uppercase;
  padding: 3px 10px 3px 8px;
  clip-path: polygon(6px 0%, 100% 0%, calc(100% - 6px) 100%, 0% 100%);
  white-space: nowrap;
}
.p5-badge-red  { background: #d32f2f; color: #fff; }
.p5-badge-white{ background: #e5e2e1; color: #0d0d0d; }
.p5-badge-dark { background: #1a1a1a; color: rgba(229,226,225,.6); border: 1px solid rgba(211,47,47,.3); }

/* === P5 HOVER UNDERLINE — link accent === */
/* The animated red bar that slides in under nav items */
.p5-link {
  position: relative;
  text-decoration: none;
}
.p5-link::after {
  content: '';
  position: absolute;
  left: 0; bottom: -2px;
  height: 3px;
  width: 0;
  background: #d32f2f;
  clip-path: polygon(0 0, 100% 0, calc(100% - 3px) 100%, 3px 100%);
  transition: width .15s cubic-bezier(.19,1,.22,1);
}
.p5-link:hover::after { width: 100%; }

/* === VERTICAL LOCATION STRIP === */
#p5Loc {
  position: fixed;
  left: 0; top: 50%;
  transform: rotate(-90deg) translateX(-50%);
  transform-origin: 0 0;
  z-index: 190;
  pointer-events: none;
  display: flex;
  align-items: center;
  gap: 0;
  white-space: nowrap;
}
#p5Loc .loc-label {
  background: #d32f2f;
  clip-path: polygon(0 0, 100% 0, calc(100% - 6px) 100%, 0 100%);
  padding: 4px 16px 4px 8px;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 900; font-style: italic;
  font-size: 8px; letter-spacing: .35em;
  text-transform: uppercase; color: #fff;
}
#p5Loc .loc-page {
  background: #e5e2e1;
  clip-path: polygon(6px 0, 100% 0, calc(100% - 6px) 100%, 0 100%);
  padding: 4px 14px;
  margin-left: -1px;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 900; font-style: italic;
  font-size: 8px; letter-spacing: .28em;
  text-transform: uppercase; color: #0d0d0d;
}
@media(max-width: 768px) { #p5Loc { display: none; } }

/* === LOADING STATE — three pulsing skewed squares === */
.p5-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 4rem 0;
}
.p5-loading span {
  display: block;
  width: 16px; height: 16px;
  transform: skewX(-12deg);
  animation: loadPulse 1.2s ease-in-out infinite;
}
.p5-loading span:nth-child(1) { background: #fff;    animation-delay: 0s; }
.p5-loading span:nth-child(2) { background: #d32f2f; animation-delay: .2s; }
.p5-loading span:nth-child(3) { background: #fff;    animation-delay: .4s; }
@keyframes loadPulse {
  0%, 100% { opacity: .15; transform: skewX(-12deg) translateY(0); }
  50%       { opacity: 1;   transform: skewX(-12deg) translateY(-6px); }
}

/* === PANEL / CONSOLE SCROLLBAR OVERRIDE === */
#conOut,
#detailPanel .dp-body {
  scrollbar-width: thin;
  scrollbar-color: #d32f2f #0d0d0d;
}
#conOut::-webkit-scrollbar,
#detailPanel .dp-body::-webkit-scrollbar { width: 4px; }
#conOut::-webkit-scrollbar-track,
#detailPanel .dp-body::-webkit-scrollbar-track { background: #0d0d0d; }
#conOut::-webkit-scrollbar-thumb,
#detailPanel .dp-body::-webkit-scrollbar-thumb { background: #d32f2f; }

/* === PAGE END / EOF MARKER === */
.p5-eof {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 2.5rem 0 1rem;
  pointer-events: none;
  user-select: none;
}
.p5-eof-rule {
  flex: 1;
  height: 2px;
  background: repeating-linear-gradient(
    90deg,
    rgba(211,47,47,.4) 0, rgba(211,47,47,.4) 8px,
    transparent 8px, transparent 16px
  );
}
.p5-eof-squares {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}
.p5-eof-squares span {
  display: block;
  width: 10px; height: 10px;
  transform: skewX(-12deg);
}
.p5-eof-squares span:nth-child(1) { background: rgba(229,226,225,.2); }
.p5-eof-squares span:nth-child(2) { background: #d32f2f; }
.p5-eof-squares span:nth-child(3) { background: rgba(229,226,225,.2); }
.p5-eof-label {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 900; font-style: italic;
  font-size: 9px; letter-spacing: .35em;
  text-transform: uppercase;
  color: rgba(229,226,225,.2);
  flex-shrink: 0;
}


/* === CONSOLE MOBILE WIDTH ===
   The #p5Con div has width:360px as inline style so the media query
   needs !important to override it on small screens. */
@media(max-width:768px){
  #p5Con { width:100% !important; border-right:none !important; }
}


/* === PREFERS-REDUCED-MOTION ===
   Strips wave animations and glitch effects for users with the OS
   setting enabled. waveGo() in shared.js also short-circuits. */
@media (prefers-reduced-motion: reduce) {
  .ws { transition: none !important; }
  #waveOverlay.active .ws1,
  #waveOverlay.active .ws2,
  #waveOverlay.active .ws3 { transform: rotate(0) translateY(120vh) !important; transition: none !important; }
  .ww { animation: none !important; transition: none !important; top: 220% !important; }
  #waveOverlay.active .ww1,
  #waveOverlay.active .ww2,
  #waveOverlay.active .ww3 { top: 220% !important; transition: none !important; }
  .glitch, .glitch::before, .glitch::after { animation: none !important; }
  .glitch::before, .glitch::after { opacity: 0 !important; }
  .stripe-bg, #p5Nav::before { animation: none !important; }
  .p5-card-anim { animation: none !important; opacity: 1 !important; }
}