@import url('https://fonts.googleapis.com/css2?family=Alexandria:wght@400;500;600;700&family=Noto+Kufi+Arabic:wght@400;600;700&display=swap');

:root{--paper:#f4dfb1;--ink:#173d35;--ochre:#dd951e;--rust:#c65d20;--sage:#567667;--cream:#f7e7bd}
*{box-sizing:border-box}
html{min-height:100%;background:#d9c69e}
body{margin:0;min-height:100vh;color:var(--text,var(--ink));font-family:"Alexandria","Noto Kufi Arabic",sans-serif;background:var(--page-bg,#d9c69e);overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:10;opacity:.18;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.68' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");mix-blend-mode:multiply}
.bio-page{position:relative;isolation:isolate;width:min(100%,480px);min-height:100svh;margin:0 auto;padding:clamp(38px,7vh,72px) 26px 112px;overflow:hidden;background:var(--background,var(--paper));border-radius:0}
.theme-decoration,.deco,.scene{position:absolute;pointer-events:none;z-index:-1}
.theme-decoration{inset:0;overflow:hidden}
.scene{width:100%;height:auto;left:0}.scene-top{top:0}.scene-bottom{bottom:0}
.profile{position:relative;min-width:0;max-width:100%;text-align:center;z-index:2}
.profile-frame{width:128px;height:128px;margin:0 auto 14px;border-radius:50%;padding:3px;background:var(--avatar-ring,var(--ochre));box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 55%,transparent)}
.profile-image{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit;background:#dda13b}
h1{font-size:clamp(28px,7.5vw,38px);line-height:1.2;margin:0 0 5px;font-weight:700;letter-spacing:-.04em}
.profile p{font-size:13px;font-weight:600;margin:0 auto 20px;line-height:1.75;max-width:360px}
.links{position:relative;display:flex;min-width:0;max-width:100%;flex-direction:column;gap:10px;z-index:2}
.link-card{position:relative;min-height:54px;padding:10px 18px;display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--button-text,var(--cream));background:var(--button-background,var(--rust));border:1px solid transparent;border-radius:14px;box-shadow:none;transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}
.link-card:nth-child(2){--button-background:var(--ochre)}.link-card:nth-child(3){--button-background:var(--sage)}.link-card:nth-child(4){--button-background:#455f50}
.link-card:hover,.link-card:focus-visible{transform:translateY(-2px);filter:brightness(1.06);box-shadow:0 8px 24px #263b3026;outline:none}
.link-icon{width:32px;height:32px;display:grid;place-items:center;flex:0 0 auto;color:currentColor}
.link-icon img{display:block;width:27px;height:27px;color:inherit;filter:var(--icon-filter,brightness(0) saturate(100%) invert(92%) sepia(21%) saturate(824%) hue-rotate(339deg) brightness(104%) contrast(94%))}
.link-title{min-width:0;flex:1;text-align:center;font-size:15px;font-weight:500;overflow-wrap:anywhere}.link-dot{display:none}
footer{position:absolute;bottom:14px;inset-inline:0;text-align:center;z-index:3;opacity:0;transition:opacity .2s}footer:hover{opacity:.65}footer a{font-size:10px;color:inherit;text-decoration:none}
@media(min-width:600px){body{padding:24px}.bio-page{min-height:min(900px,calc(100vh - 48px));border-radius:28px;box-shadow:0 24px 70px #273b3150}}
@media(max-width:380px){.bio-page{padding-inline:18px}.profile-frame{width:112px;height:112px}.link-card{min-height:50px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}