:root{--color-text:#ffffff;--card-bg:rgba(255,255,255,0.1);--card-bg-hover:rgba(255,255,255,0.15);--card-border:rgba(255,255,255,0.2);--card-border-hover:rgba(255,255,255,0.4);--surface-subtle:rgba(255,255,255,0.2);--btn-bg:rgba(0,0,0,0.55);--btn-bg-hover:rgba(0,0,0,0.75);--btn-border:rgba(255,255,255,0.25);--btn-border-hover:rgba(255,255,255,0.5);--card-radius:20px;--tag-radius:12px;--btn-radius:10px;--anim-duration-gradient:15s;--anim-duration-fast:0.75s;--anim-duration-faster:0.2s;--anim-easing:ease;--blur-amount:10px;--spacing-xs:16px;--spacing-sm:20px;--spacing-md:30px;--spacing-lg:60px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;overflow-x:hidden;color:var(--color-text);min-height:100vh}#background{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-2;background:linear-gradient(45deg,#1e3a8a,#7c3aed,#db2777,#dc2626,#ea580c,#22c55e);background-size:400% 400%;animation:gradientShift var(--anim-duration-gradient) var(--anim-easing) infinite}@keyframes gradientShift{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}#particles{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1}.container{max-width:1200px;margin:0 auto;padding:var(--spacing-lg) var(--spacing-sm);position:relative;z-index:1}header{text-align:center;margin-bottom:80px}h1{font-size:4rem;font-weight:700;margin-bottom:var(--spacing-sm);text-shadow:0 4px 20px rgba(0,0,0,.3);letter-spacing:-.02em}.tagline{font-size:1.5rem;opacity:.9;font-weight:300}.projects{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));grid-gap:var(--spacing-md);gap:var(--spacing-md);margin-top:var(--spacing-lg)}.project-card{background:var(--card-bg);-webkit-backdrop-filter:blur(var(--blur-amount));backdrop-filter:blur(var(--blur-amount));border-radius:var(--card-radius);padding:var(--spacing-md);border:1px solid var(--card-border);transition:all var(--anim-duration-fast) var(--anim-easing);cursor:pointer;text-decoration:none;color:inherit;display:block}.project-card:hover{transform:translateY(-8px);background:var(--card-bg-hover);box-shadow:0 20px 40px rgba(0,0,0,.3);border-color:var(--card-border-hover)}@media (hover:none){.project-card:hover{transform:none;box-shadow:none}}.project-title{font-size:1.5rem;font-weight:600;margin-bottom:12px}.project-description{opacity:.85;line-height:1.6;margin-bottom:15px}.project-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:15px}.tag{background:var(--surface-subtle);padding:4px 12px;border-radius:var(--tag-radius);font-size:.85rem;font-weight:500}.tag-filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:var(--spacing-sm)}.tag-filter .tag{cursor:pointer;border:1px solid transparent;background:none;font-family:inherit;transition:background var(--anim-duration-faster) var(--anim-easing),border-color var(--anim-duration-faster) var(--anim-easing)}.tag-filter .tag:hover{background:var(--card-bg);border-color:var(--card-border)}.tag-filter .tag.tag--active{background:var(--card-bg-hover);border-color:var(--card-border-hover)}.project-page{position:relative;width:100%;height:100vh;overflow:hidden}.project-controls{position:fixed;top:var(--spacing-xs);left:var(--spacing-xs);right:var(--spacing-xs);display:flex;justify-content:space-between;z-index:10;pointer-events:none}.back-btn,.fullscreen-btn{pointer-events:all;background:var(--btn-bg);color:var(--color-text);border:1px solid var(--btn-border);padding:8px 18px;border-radius:var(--btn-radius);cursor:pointer;-webkit-backdrop-filter:blur(var(--blur-amount));backdrop-filter:blur(var(--blur-amount));text-decoration:none;font-size:.9rem;font-family:inherit;transition:background var(--anim-duration-faster) var(--anim-easing),border-color var(--anim-duration-faster) var(--anim-easing)}.back-btn:hover,.fullscreen-btn:hover{background:var(--btn-bg-hover);border-color:var(--btn-border-hover)}.project-iframe{width:100%;height:100vh;border:none;display:block}.iframe-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:rgba(0,0,0,.4);-webkit-backdrop-filter:blur(var(--blur-amount));backdrop-filter:blur(var(--blur-amount));color:var(--color-text);font-size:1rem;z-index:5}.iframe-spinner{width:40px;height:40px;border:3px solid rgba(255,255,255,.3);border-top:3px solid var(--color-text);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.iframe-error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:rgba(0,0,0,.5);-webkit-backdrop-filter:blur(var(--blur-amount));backdrop-filter:blur(var(--blur-amount));color:var(--color-text);font-size:1rem;text-align:center;padding:var(--spacing-md);z-index:5}.iframe-error a{color:var(--color-text);text-decoration:underline;opacity:.85}.iframe-error a:hover{opacity:1}@keyframes zen-pulse{0%,to{opacity:.6;box-shadow:0 0 6px rgba(255,255,255,.15)}50%{opacity:.85;box-shadow:0 0 12px rgba(255,255,255,.25)}}.zen-btn{position:fixed;bottom:20px;left:20px;width:28px;height:28px;border-radius:50%;border:none;background:rgba(255,255,255,.15);-webkit-backdrop-filter:blur(var(--blur-amount));backdrop-filter:blur(var(--blur-amount));cursor:pointer;z-index:50;padding:0;filter:blur(2.5px);animation:zen-pulse 4s ease-in-out infinite;transition:opacity 2s ease,box-shadow .4s ease,background .4s ease,filter .4s ease}.zen-btn:hover{animation-play-state:paused;opacity:1;background:rgba(255,255,255,.7);box-shadow:0 0 20px rgba(255,255,255,.5);filter:blur(10px)}.container{transition:opacity 2s ease}body.zen-mode .container{opacity:0;pointer-events:none}.zen-btn-wrap{transition:opacity 2s ease}.zen-btn-wrap--hidden{opacity:0;pointer-events:none}@media (max-width:768px){h1{font-size:2.5rem}.tagline{font-size:1.2rem}.projects{grid-template-columns:1fr}}