:root{--orange:#f28c00;--orange2:#ffad32;--charcoal:#1b1d22;--panel:#292c33;--paper:#fffaf2;--muted:#aeb3bd;--blue:#71b7ff;--shadow:#090a0d;--max:520px}
*{box-sizing:border-box}html{min-height:100%;background:#15171b}body{margin:0;min-height:100%;font-family:Inter,ui-rounded,"Segoe UI",system-ui,-apple-system,sans-serif;color:var(--paper);background:
linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),radial-gradient(circle at 50% -10%,#454a53 0,#25282e 34%,#15171b 72%);background-size:38px 38px,38px 38px,auto;background-attachment:fixed;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.16;background-image:radial-gradient(circle at 12px 12px,rgba(242,140,0,.7) 1px,transparent 1.5px);background-size:76px 76px;mask-image:linear-gradient(to bottom,#000,transparent 78%)}a{color:inherit}.ambient{position:fixed;border-radius:50%;filter:blur(80px);opacity:.17;pointer-events:none}.ambient-one{width:320px;height:320px;background:var(--orange);top:-130px;right:-100px}.ambient-two{width:260px;height:260px;background:var(--blue);left:-120px;top:45%}.landing-shell{width:min(calc(100% - 28px),var(--max));margin:0 auto;padding:24px 0 42px;position:relative}.hero{text-align:center}.hero-art-wrap{position:relative;min-height:286px;display:flex;align-items:flex-end;justify-content:center}.hero-art{width:min(94vw,430px);max-height:350px;object-fit:contain;filter:drop-shadow(0 20px 18px rgba(0,0,0,.34));animation:float 5s ease-in-out infinite}.speech-bubble{position:absolute;right:0;top:6px;background:var(--paper);color:#24262b;border:3px solid var(--charcoal);border-radius:14px;padding:10px 13px;font-weight:800;font-size:.78rem;line-height:1.25;box-shadow:6px 7px 0 var(--orange)}.speech-bubble:after{content:"";position:absolute;left:18px;bottom:-14px;border:8px solid transparent;border-top-color:var(--paper);transform:rotate(12deg)}h1{font-size:clamp(2.8rem,12vw,4.5rem);margin:-2px 0 8px;letter-spacing:-.06em;line-height:.95;text-shadow:0 5px 0 #0b0c0e}h1:after{content:".";color:var(--orange)}.tagline{display:inline-flex;align-items:center;gap:8px;margin:8px 0 22px;padding:9px 14px;border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.055);font-size:.86rem;color:#e2e4e8;box-shadow:0 6px 18px rgba(0,0,0,.22)}.status-dot{width:9px;height:9px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 4px rgba(242,140,0,.18)}.link-stack{display:grid;gap:11px}.social-card{display:grid;grid-template-columns:48px 1fr auto;gap:13px;align-items:center;min-height:68px;padding:10px 12px;text-decoration:none;background:linear-gradient(145deg,#32353d,#24262c);border:1px solid rgba(255,255,255,.11);border-radius:14px;box-shadow:0 7px 0 #0d0e11,0 12px 25px rgba(0,0,0,.22);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;cursor:pointer;position:relative;overflow:hidden}.social-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--orange)}.social-card:hover,.social-card:focus-visible{transform:translateY(-3px);border-color:rgba(242,140,0,.7);box-shadow:0 10px 0 #0d0e11,0 18px 30px rgba(0,0,0,.3);outline:none}.social-card:active{transform:translateY(3px);box-shadow:0 3px 0 #0d0e11}.icon-box{width:48px;height:48px;border-radius:12px;display:grid;place-items:center;background:var(--orange);color:#191a1e;font-weight:950;letter-spacing:-.06em;box-shadow:inset 0 0 0 2px rgba(255,255,255,.25)}.link-copy{display:flex;flex-direction:column;min-width:0}.link-copy strong{font-size:1.03rem}.link-copy small{color:var(--muted);font-size:.78rem;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action{height:36px;min-width:36px;padding:0 10px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.075);color:var(--orange2);font-weight:900}.copy-action{font-size:.72rem}.gallery-link{margin-top:5px;background:linear-gradient(145deg,#3b3429,#272522)}.gallery-link .icon-box{background:var(--blue)}.gallery-link:before{background:var(--blue)}.gallery-link .action{color:var(--blue)}footer{text-align:center;margin-top:38px;color:#8f949f;font-size:.76rem}.footer-avatar{width:94px;height:94px;border-radius:50%;object-fit:cover;border:3px solid var(--orange);box-shadow:0 8px 0 #0d0e11;margin-bottom:8px}.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,30px);opacity:0;background:var(--paper);color:#202126;padding:11px 16px;border-radius:999px;font-weight:850;box-shadow:0 12px 30px rgba(0,0,0,.4);transition:.22s ease;z-index:50}.toast.show{opacity:1;transform:translate(-50%,0)}
/* Gallery */.gallery-shell{width:min(calc(100% - 28px),1050px);margin:0 auto;padding:34px 0 60px;position:relative}.gallery-header{margin-bottom:24px}.back-link{display:inline-block;color:var(--orange2);font-weight:800;text-decoration:none;margin-bottom:20px}.gallery-title-row{display:flex;align-items:center;gap:18px}.gallery-title-row img{width:92px;height:92px;border-radius:24px;object-fit:cover;border:3px solid var(--orange);box-shadow:0 8px 0 #0b0c0f}.gallery-title-row h1{font-size:clamp(2.25rem,8vw,4rem);margin:0 0 7px}.gallery-title-row p{margin:0;color:var(--muted)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}.gallery-card{padding:0;border:1px solid rgba(255,255,255,.12);border-radius:16px;overflow:hidden;background:#292c32;color:var(--paper);text-align:left;cursor:pointer;box-shadow:0 8px 0 #0c0d10;transition:.18s ease}.gallery-card:hover,.gallery-card:focus-visible{transform:translateY(-4px);border-color:var(--orange);outline:none}.gallery-card img{display:block;width:100%;aspect-ratio:1;object-fit:cover;background:#111}.gallery-card span{display:flex;flex-direction:column;padding:13px 14px 15px}.gallery-card strong{font-size:1rem}.gallery-card small{color:var(--muted);margin-top:3px}.lightbox{position:fixed;inset:0;padding:20px;background:rgba(5,6,8,.88);backdrop-filter:blur(9px);display:none;place-items:center;z-index:100}.lightbox.open{display:grid}.lightbox-panel{width:min(100%,1100px);max-height:calc(100vh - 40px);display:flex;flex-direction:column;background:#1f2227;border:1px solid rgba(255,255,255,.13);border-radius:18px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.65)}.lightbox-head{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:13px 16px;background:#f7f3ec;color:#222}.lightbox-head h2{font-size:1rem;margin:0}.lightbox-head p{font-size:.75rem;color:#666;margin:3px 0 0}.lightbox-actions{display:flex;gap:8px;align-items:center}.download-btn,.close-btn{border:0;border-radius:999px;padding:9px 13px;background:#222;color:#fff;text-decoration:none;font-weight:800;font-size:.78rem}.close-btn{width:36px;height:36px;padding:0;background:#e6e1d9;color:#222;font-size:1.35rem;cursor:pointer}.lightbox-stage{min-height:0;position:relative;display:flex;align-items:center;justify-content:center;padding:16px;background:#111318;flex:1}.lightbox-stage img{max-width:100%;max-height:calc(100vh - 155px);object-fit:contain}.nav-btn{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:58px;border:0;border-radius:13px;background:rgba(0,0,0,.55);color:#fff;font-size:2.2rem;cursor:pointer}.nav-btn.prev{left:12px}.nav-btn.next{right:12px}.lightbox-counter{text-align:center;padding:7px;background:#191b20;color:#999;font-size:.74rem}
@keyframes float{50%{transform:translateY(-8px) rotate(-.4deg)}}@media(max-width:560px){.landing-shell{padding-top:8px}.hero-art-wrap{min-height:248px}.speech-bubble{right:2px;top:2px;font-size:.69rem}.social-card{min-height:64px;grid-template-columns:44px 1fr auto}.icon-box{width:44px;height:44px}.gallery-title-row img{width:72px;height:72px;border-radius:19px}.lightbox{padding:0}.lightbox-panel{max-height:100vh;height:100%;border-radius:0}.lightbox-head{padding:11px}.download-btn{padding:8px 10px}.lightbox-stage img{max-height:calc(100vh - 140px)}.nav-btn{width:39px;height:50px}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.gallery-card span{padding:10px}.gallery-card small{font-size:.69rem}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

.icon-box {
    width: 52px;
    height: 52px;
    flex-shrink: 0;

    overflow: hidden;      /* clips anything outside */
    border-radius: 14px;   /* same radius as your icons */

    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.icon-box img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;     /* fills the box */
}