/* Thowi Labs BLOOM · animated icon gallery, scoped to /proyectos.
   Ten original SVG concepts mapped to the curated public GitHub projects.
   No external icon fonts, animation packages or background downloads. */
.page-proyectos .repo-gallery {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
  gap:clamp(14px,1.6vw,25px);
  margin:0 clamp(18px,5vw,90px);
  border:0;
}
.page-proyectos .repo-gallery .repo-tile {
  --repo-color:#4c8061;
  --repo-wash:#dfebdf;
  --repo-coral:#d08060;
  position:relative;
  display:flex;
  min-width:0;
  min-height:432px;
  overflow:hidden;
  padding:0;
  border:1px solid #bdcfba;
  border-radius:25px;
  background:#fafbf2;
  color:#294731;
  box-shadow:0 12px 28px #49664b0c;
  transition:transform .35s cubic-bezier(.2,.8,.2,1),
    box-shadow .35s ease,border-color .35s ease;
}
.page-proyectos .repo-gallery .repo-tile:hover,
.page-proyectos .repo-gallery .repo-tile:focus-within {
  padding:0;
  border-color:#85ad87;
  box-shadow:0 20px 40px #365d3932;
  transform:translateY(-7px);
}
.page-proyectos .repo-gallery .repo-tile[hidden] {display:none!important}
.page-proyectos .repo-tile-link {
  display:flex;
  width:100%;
  height:100%;
  min-width:0;
  flex-direction:column;
  padding:clamp(18px,2vw,27px);
  text-decoration:none;
  color:inherit;
  border-radius:inherit;
  -webkit-tap-highlight-color:transparent;
}
.page-proyectos .repo-tile-link:focus-visible{
  outline:3px solid #bf7859;
  outline-offset:-5px;
}
.page-proyectos .repo-tile-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  position:relative;
  z-index:2;
  min-height:23px;
}
.page-proyectos .repo-tile-lang {
  display:inline-flex;
  align-items:center;
  gap:7px;
  font:800 10px/1.4 'DM Sans',Arial,sans-serif;
  color:var(--repo-color);
  letter-spacing:.06em;
  text-transform:uppercase;
}
.page-proyectos .repo-tile-lang::before {
  content:"";
  display:block;
  flex:none;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--repo-color);
}
.page-proyectos .repo-tile-featured{
  color:#a36049;
  background:#f7eae0;
  border:1px solid #e8cdbd;
  border-radius:99px;
  padding:5px 9px;
  font:800 9px/1 'DM Sans',Arial,sans-serif;
  letter-spacing:.06em;
}
.page-proyectos .repo-tile-art {
  position:relative;
  isolation:isolate;
  display:grid;
  place-items:center;
  min-width:0;
  height:clamp(186px,17vw,228px);
  margin:14px 0 22px;
  border:1px solid #d7e4d4;
  border-radius:21px;
  background:
    radial-gradient(circle at 52% 45%,#fafaf5 0%,var(--repo-wash) 100%);
  overflow:hidden;
  transition:background .35s;
}
.page-proyectos .repo-tile-art::before {
  content:"";
  position:absolute;
  width:320px;
  height:320px;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  background:repeating-radial-gradient(
    circle at center,
    transparent 0 38px,
    #557c5d14 39px 40px,
    transparent 41px 70px);
  pointer-events:none;
}
.page-proyectos .repo-tile-orbit {
  position:absolute;
  top:50%;
  left:50%;
  width:170px;
  height:170px;
  border:1px dashed #78997e55;
  border-radius:50%;
  transform:translate(-50%,-50%) rotate(0deg);
  pointer-events:none;
}
.page-proyectos .repo-tile-icon {
  position:relative;
  z-index:1;
  width:min(78%,186px);
  height:clamp(146px,14vw,181px);
  color:var(--repo-color);
  overflow:visible;
  filter:drop-shadow(0 9px 10px #3c65402a);
  pointer-events:none;
}
.page-proyectos .repo-tile-icon .repo-accent-fill{
  fill:var(--repo-coral);
  stroke:var(--repo-coral);
}
.page-proyectos .repo-tile-icon .repo-soft-fill{
  fill:#ffffff72;
}
.page-proyectos .repo-tile-icon .repo-bg-outline{
  fill:#fbfbf65c;
}
.page-proyectos .repo-tile-art-caption {
  position:absolute;
  z-index:2;
  right:13px;
  bottom:10px;
  color:#6b8a719c;
  font:700 8px/1.4 'DM Sans',Arial,sans-serif;
  letter-spacing:.05em;
}
.page-proyectos .repo-gallery .repo-tile .repository-core {
  min-width:0;
  flex:1;
}
.page-proyectos .repo-gallery .repo-tile .repository-core h3 {
  color:#284532;
  font:700 clamp(21px,1.8vw,27px)/1.2 'DM Sans',Arial,sans-serif;
  letter-spacing:-.038em;
  overflow-wrap:anywhere;
}
.page-proyectos .repo-gallery .repo-tile .repository-core p {
  font:400 12px/1.65 'DM Sans',Arial,sans-serif;
  color:#56705b;
  opacity:1;
  margin-top:11px;
  max-width:none;
  overflow-wrap:anywhere;
}
.page-proyectos .repo-gallery .repo-tile .repository-open {
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:22px;
  padding-top:15px;
  width:100%;
  color:#4a7758;
  border-top:1px solid #cbdcc8;
  font:800 10px/1.4 'DM Sans',Arial,sans-serif;
  letter-spacing:.09em;
}
.page-proyectos .repo-gallery .repo-tile .repository-open span {
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border-radius:50%;
  background:#e8eee0;
  color:#bc785f;
  font:500 20px/1 'DM Sans',Arial,sans-serif;
  transition:transform .28s,background .28s;
}
.page-proyectos .repo-gallery .repo-tile:hover .repository-open span,
.page-proyectos .repo-gallery .repo-tile:focus-within .repository-open span{
  transform:translate(3px,-3px);
  background:#f8e4da;
}
.page-proyectos .repo-tile[data-project="open-neo-tts"]{--repo-color:#4e8465;--repo-wash:#dfeee3}
.page-proyectos .repo-tile[data-project="SitioGato"]{--repo-color:#b17b60;--repo-wash:#f3e7d8}
.page-proyectos .repo-tile[data-project="Goradio"]{--repo-color:#477f7c;--repo-wash:#dceeea}
.page-proyectos .repo-tile[data-project="ace-step-kaggle-studio"]{--repo-color:#9974a2;--repo-wash:#ede4f1}
.page-proyectos .repo-tile[data-project="yue2-music-lab"]{--repo-color:#b77c7b;--repo-wash:#f0e5e7}
.page-proyectos .repo-tile[data-project="VoxCPM2-Studio"]{--repo-color:#6387a0;--repo-wash:#e1ecf2}
.page-proyectos .repo-tile[data-project="CC-Proxy"]{--repo-color:#aa815d;--repo-wash:#f2eadd}
.page-proyectos .repo-tile[data-project="opencode-commandcode-provider"]{--repo-color:#5e7e97;--repo-wash:#e1ebef}
.page-proyectos .repo-tile[data-project="Poster-Splitter"]{--repo-color:#bc8069;--repo-wash:#f4e8db}

/* Per-project movement is active only in viewport or on focus/hover.
   Every stroke remains a meaningful complete illustration when paused. */
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-tile-orbit {
  animation:repo-orbit 24s linear infinite;
}
@keyframes repo-orbit{
  to{transform:translate(-50%,-50%) rotate(360deg)}
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-voice-wave{
  animation:repo-audio 2.4s ease-in-out infinite;
  transform-origin:105px 80px;
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-voice-device{
  animation:repo-soft-bob 3.2s ease-in-out infinite;
}
@keyframes repo-audio{
  0%,100%{opacity:.28;transform:scale(.90)}
  50%{opacity:1;transform:scale(1.03)}
}
@keyframes repo-soft-bob{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-5px)}
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-cat{
  animation:repo-cat-purr 4s ease-in-out infinite;
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-cat-eyes{
  animation:repo-cat-blink 5.4s steps(1) infinite;
}
@keyframes repo-cat-purr{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-3px)}
}
@keyframes repo-cat-blink{
  0%,42%,47%,100%{opacity:1}
  43%,46%{opacity:0}
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-window-front{
  animation:repo-soft-bob 3.6s ease-in-out infinite;
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-radio-signal{
  animation:repo-audio 2.5s ease-in-out infinite;
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-music-note{
  animation:repo-soft-bob 2.8s ease-in-out infinite;
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-beat-bars path{
  transform-box:fill-box;
  transform-origin:center bottom;
  animation:repo-equalizer 1.25s ease-in-out infinite alternate;
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-beat-bars path:nth-child(2){animation-delay:-.35s}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-beat-bars path:nth-child(3){animation-delay:-.8s}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-beat-bars path:nth-child(4){animation-delay:-.55s}
@keyframes repo-equalizer{
  from{transform:scaleY(.48)}
  to{transform:scaleY(1.13)}
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-spark{
  animation:repo-sparkle 2.8s ease-in-out infinite;
}
@keyframes repo-sparkle{50%{opacity:.25}}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-vinyl{
  transform-origin:80px 80px;
  animation:repo-record-spin 9s linear infinite;
}
@keyframes repo-record-spin{to{transform:rotate(360deg)}}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-needle{
  transform-origin:126px 39px;
  animation:repo-needle 5.2s ease-in-out infinite;
}
@keyframes repo-needle{
  0%,100%{transform:rotate(0deg)}
  50%{transform:rotate(9deg)}
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-mic-waves{
  animation:repo-audio 2.2s ease-in-out infinite;
  transform-origin:80px 83px;
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-microphone{
  animation:repo-soft-bob 3.5s ease-in-out infinite;
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-terminal-caret{
  animation:repo-sparkle 1s steps(2,end) infinite;
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-terminal-panel{
  animation:repo-soft-bob 4s ease-in-out infinite;
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-proxy-flow{
  animation:repo-proxy-packets 2.5s ease-in-out infinite;
}
@keyframes repo-proxy-packets{
  0%,100%{transform:translateX(-5px);opacity:.5}
  50%{transform:translateX(5px);opacity:1}
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-code-braces{
  animation:repo-braces 3.2s ease-in-out infinite;
}
@keyframes repo-braces{
  0%,100%{transform:scaleX(1)}
  50%{transform:scaleX(1.08)}
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-code-plug{
  animation:repo-soft-bob 3s ease-in-out infinite;
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-poster-piece{
  animation:repo-split-tiles 4.4s cubic-bezier(.25,.75,.3,1) infinite;
}
@keyframes repo-split-tiles{
  0%,15%,90%,100%{transform:translate(0,0)}
  42%,66%{transform:translate(var(--piece-x),var(--piece-y))}
}
.page-proyectos .repo-gallery .repo-tile.is-animated .repo-poster-guide{
  animation:repo-sparkle 4.4s ease-in-out infinite;
}

/* Tablet shows two cards; narrow phones display one comfortable, tappable card. */
@media(max-width:1110px){
  .page-proyectos .repo-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .page-proyectos .repo-gallery .repo-tile{min-height:415px}
  .page-proyectos .repo-tile-art{height:210px}
}
@media(max-width:650px){
  .page-proyectos .repo-gallery{grid-template-columns:1fr;gap:15px;margin:0 18px}
  .page-proyectos .repo-gallery .repo-tile{min-height:0}
  .page-proyectos .repo-tile-link{padding:20px}
  .page-proyectos .repo-tile-art{height:196px;margin:14px 0 19px}
  .page-proyectos .repo-tile-icon{height:165px;width:165px}
  .page-proyectos .repo-gallery .repo-tile .repository-core h3{font-size:25px}
  .page-proyectos .repo-gallery .repo-tile .repository-core p{font-size:13px}
  .page-proyectos .repo-gallery .repo-tile .repository-open{margin-top:17px}
}
@media(prefers-reduced-motion:reduce){
  .page-proyectos .repo-gallery .repo-tile,
  .page-proyectos .repo-gallery .repo-tile *,
  .page-proyectos .repo-gallery .repo-tile *::before,
  .page-proyectos .repo-gallery .repo-tile *::after{
    animation:none!important;
    transition:none!important;
  }
}